2017-08-21 46 views
1

我正在Chart.js中製作一個圖表,我的問題是我有和這樣的對象的數組 0: {y: 17854.69, y2: 14283.75, x: Thu Aug 17 2017 02:00:00 GMT+0200 (Romance Daylight Time)} 1: {y: 41750.08, y2: 33400.06, x: Wed Aug 16 2017 02:00:00 GMT+0200 (Romance Daylight Time)}我如何迭代或獲取Chart.js中的對象關鍵字數組中的所有對象

我的圖有兩個Y與不同的數據軸和斧日期軸。我的charData看起來像這樣。

var chartData = { 
       labels: dates, 
       datasets: [{ 
         yAxisID: "funding", 
         label: "Credorax DK Funding", 
         data: [{ 
           y: CredoraxDK[i].y, 
           x: CredoraxDK[i].x 

         }], 
         position: "left", 
        }, 
        { 
         yAxisID: "release", 
         label: "Credorax DK Release", 
         data: [{ 
           y: CredoraxDK[i].y2, 
           x: CredoraxDK[i].x 

         }], 
         position: "right", 
        }, 

當我嘗試這樣做,我只得到數組中的第一個對象鍵。有什麼辦法可以迭代通過給定的鍵數組?

我的新的圖表看起來像這樣

   var ctx = document.getElementById("likviditetChart").getContext("2d"); 
      var chart = new Chart(ctx, { 
       type: "line", 
       data: chartData, 

       options: { 
        stacked: false, 
        responsive: true, 
        onHover: [], 
        tooltips: { 
         mode: "index", 
         intersect: false 
        }, 
        scales: { 
         yAxes: [{ 
           ticks: { 
            max: 100000, 
            min: 0, 
           }, 
           type: "linear", 
           display: true, 
           title: "Funding", 
           id: "funding", 
           position: "left", 

          }, { 
           ticks: { 
            max: 100000, 
            min: 0, 
           }, 
           type: "linear", 
           display: true, 
           title: "Release", 
           id: "release", 
           position: "right", 
          }] 
        } 
       } 
      }); 

Picture of graph. As you can see there are only two points on the graph, and i have 6 objects in my array, but when i write chart data like this, chart.js only puts out the first object in the array

希望我的問題能以某種方式得到解決。

回答

1

如果我理解正確的話,這是你的意思;

如果您已經創建chartData,您可以存取權限的數據集如下:

chartData = { 
    datasets: [{ 
       yAxisID: "funding", 
       label: "Credorax DK Funding", 
       data: [], 
       position: "left", 
     }, 
     { 
       yAxisID: "release", 
       label: "Credorax DK Release", 
       data: [], 
       position: "right", 
     } 
    ,//other config, etc... 
    }; 

//init chart with this config 
var ctx = document.getElementById("likviditetChart").getContext("2d"); 
var chart = new Chart(ctx, chartData); 

//itterate your data and add it to the datasets 
for (var i = 0; i < CredoraxDK.length;i++){ 
    chartData.datasets[0].data.push({ 
          y: CredoraxDK[i].y, 
          x: CredoraxDK[i].x}); 
    chartData.datasets[1].data.push({ 
          y: CredoraxDK[i].y2, 
          x: CredoraxDK[i].x}); 
} 

//update new data. 
chart.update(); 

所以基本上,您可以設置圖表配置第一,和圖表數據後添加到數據陣列。

不要忘記調用chart.update();功能,當您完成。

+0

正是我一直在尋找,爲感謝)。我現在工作完美。 –

+0

@ThomasStaal:升值通常是由表達了投票,甚至標誌着答案:-) – Stefan

+0

不幸的是,OP不接受你的答案的答案。你有我的投票。 – trincot