2017-01-26 8 views
1

Я пытаюсь воссоздать эту диаграмму с использованием высоких диаграмм api. Любые идеи, как это сделать? Попытка группировать категории года с номерами и столбцами процента, см. Пример pic. Благодаря!Highcharts процентов со значением

1

Я попытался это до сих пор, но не может получить как стоимость и проценты, как на картинке прилагается:

Highcharts.chart('ContainerMonthToDate', { 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: null 
     }, 
     subtitle: { 
      text: null 
     }, 
     xAxis: { 
      categories: [ 
       'Jan 2017', 
       'Jan 2016' 

      ], 
      crosshair: true 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: '# Patients' 
      } 
     }, 


     labels: { 
      formatter: function(){ 
       return 100*this.value/$(this.axis.tickPositions).last()[0] + '%'; 
      } 

    }, 


     tooltip: { 
      headerFormat: '<span style="font-size:10px">{point.key}</span><table>', 
      pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' + 
       '<td style="padding:0"><b>{point.y:.1f} </b></td></tr>', 
      footerFormat: '</table>', 
      shared: true, 
      useHTML: true 
     }, 
     plotOptions: { 
      column: { 
       dataLabels: { 
        enabled: true, 
        crop: false, 
        overflow: 'none' 
       } 
      } 
     }, 


     colors: [ 
      '#ff0000', 
      '#ff0000', 
      '#ff0000', 
      '#ff0000' 
     ], 

     series: [{ 
      name: 'Cumulative', 
      data: [8657, 7824] 

     }, { 
      name: 'Admissions', 
      data: [2025, 1898] 

     }, { 
      name: 'Budgeted', 
      data: [8018, 7913] 

     }, { 
      showInLegend: false, 
      name: '', 
      data: [1956, 1889] 


     }] 



    }); 
+0

Технические проблемы легки в использовании ugh выработать - добавьте вторую ось y, назначьте ей% серии (посмотрите на демонстрационную страницу). То, с чем я борюсь, - это сам дизайн диаграммы. Каковы проценты, рассчитанные против? Зачем вам нужен второй столбец для процента? Почему кумулятивный счет только имеет счет, только у допущений есть%, а в бюджете есть оба? Полагаю, я думаю, что есть много возможностей для повышения эффективности этого графика, с которым я был бы рад помочь, вне решения вашей текущей технической проблемы. – jlbriggs

ответ

0

Чтобы объединить два типа данных, использовать это определение YAxis:

yAxis: [{ 
     title: { 
      text: '# Pts' 
     } 
    }, { 
     opposite: true, 
     max: 100, 
     title: { 
      text: '% Pts' 
     }, 
     labels: { 
      format: '{value} %', 
      style: { 
       color: Highcharts.getOptions().colors[2] 
      } 
     } 
    }], 

example on jsfiddle

+0

это мне очень помогло, спасибо! – user1809684

Смежные вопросы