2016-08-26 4 views
1

Я хочу использовать названия моей серии как xAxis. Я пробовал его, как код ниже. Этот код создает несколько рядов, но только одно значение оси x. Скажем, в моем коде я хочу создать серию для каждого фонда и значения фонда фонда в xAxis.Использовать названия серий как xAxis в Highcharts

function draw(fund, zreturn) { 

    zreturn = [12.75, 11.77, 13.76]; 
    fund = ['abc', 'xyz', 'pqr']; 

    var options = {}; 
    options = { 

     chart: { 
      renderTo: 'graphDiv', 
      type: 'line', 
      Height: '400px' 

     }, 
     credits: { 
      enabled: false 
     }, 
     title: { 
      text: 'Fund Performance Graph', 
      x: -20 
     }, 

     subtitle: { 
      text: '', 
      x: -20 
     }, 

     xAxis: { 
      categories: fund 
      } 
     }, 

     yAxis: { 
      labels: { 
       enabled: true, 
       format: function() { 
        return (this.value + '%') 
       } 
      } 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'middle', 
      borderWidth: 0, 

     }, 

     series: zreturn.filter(function (zreturn, i) { 


      return fund[i] 

     }).map(function (zreturn, i) { 
      /* Then return as series */ 
      return { 
       //type: 'line', 
       name: fund[i], 
       data: zreturn, 
       dataLabels: { 
        align: 'center', 
        enabled: true, 
        format: "{y:.2f}" + '%', 
        style: { 
         fontSize: "8px", 
         fontFamily: 'Arial', 

        }, 

       } 
      } 
     }) 
    } 

    var chart = new Highcharts.Chart(options); 

}; 
+1

я исправил свой код, он будет работать, как вы хотите: http://jsfiddle.net/worg6jLz/26/ –

+0

@ GrzegorzBlachliński Работает отлично. не могли бы вы объяснить, что вы сделали? – MaazKhan47

+0

Я написал ответ с объяснением изменений –

ответ

1

Я думаю, что прямо сейчас у вас небольшие ошибки в коде.

Прежде всего вы используете функцию yAxis.labels.format как функцию. Это должно быть форматировщик, если вы хотите использовать его как функция:

yAxis: { 
    labels: { 
    enabled: true, 
    formatter: function() { 
     return (this.value + '%') 
    } 
    } 
}, 

Далее, у вас есть ошибки в данных, он должен быть массивом:

data: [ 
    [i, zreturn] 
], 

Я здесь добавляя й значение ваша точка, а также значение y. Если я не буду добавлять значение x, точки всегда будут начинаться с 0 и потому, что вы добавили только одну точку в каждую серию, все они будут в первой категории.

Здесь вы можете найти пример того, как ваш график может работать с этими небольшими поправками: http://jsfiddle.net/worg6jLz/29/

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