在Highcharts中使用系列名稱作爲xAxis

我想將我的系列名稱用作xAxis。我已經嘗試了下面的代碼。此代碼正在創建多個系列，但只有一個x軸值。讓我們說在我的代碼中，我想爲每個基金創建系列，並在xAxis中繪製基金價值。在Highcharts中使用系列名稱作爲xAxis

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); 

};

來源

2016-08-26 MaazKhan47

我已經糾正你的代碼，以便它會像你想：http://jsfiddle.net/worg6jLz/26/ –

@GrzegorzBlachliński它的工作完美。你能解釋一下你做了什麼嗎？ – MaazKhan47

我發佈瞭解釋更改的答案 –

我認爲你現在的代碼有小錯誤。

首先，您使用yAxis.labels.format作爲函數。它應該是格式，如果你想使用它作爲一個功能：

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

接下來，你必須在你的數據的錯誤，它應該是一個數組：

data: [ 
    [i, zreturn] 
],

我在這裏加入的x值你的觀點以及y值。如果我不添加x值，點總是從0開始，並且因爲您只爲每個系列添加了一個點，所有點都將位於第一個類別。

在這裏你可以找到一個例子，說明你的圖表可能與這些小的修正工作： http://jsfiddle.net/worg6jLz/29/

來源

2016-08-26 10:42:49

在Highcharts中使用系列名稱作爲xAxis

回答

相關問題