採取一個對象的數組，並把它放在條形圖

我是一個新的，當談到jQuery和JavaScript，但我試圖學習緩慢。我的問題是，如果我有一個json文件，看起來像採取一個對象的數組，並把它放在條形圖

var data= [{"tasknumber":304030, 
    "date":"2012-05-05", 
    "operator":"john doe"}, 
    {"tasknumber":23130, 
    "date":"2012-07-07", 
    "operator":"john doeeeeeeee"}, 
    {"tasknumber":233330, 
    "date":"2012-08-08", 
    "operator":"john doe"}]

和我申請.countBy將其從下劃線庫得到一個數組，看起來像這樣

{"john doe":2,"john doeeeeeeee":1}

所以下一部分使用的IM，我在網上找到

樣本jQuery的圖形輪廓

<!DOCTYPE HTML> 
<html> 
<head> 
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> 
<script type="text/javascript"> 

window.onload = function() { 
    var chart = new CanvasJS.Chart("chartContainer", { 
     title:{ 
      text: "My First Chart in CanvasJS"    
     }, 
     data: [    
     { 
      // Change type to "doughnut", "line", "splineArea", etc. 
      type: "column", 
      dataPoints: [ 
       { label: "apple", y: 10 }, 
       { label: "orange", y: 15 }, 
       { label: "banana", y: 25 }, 
       { label: "mango", y: 30 }, 
       { label: "grape", y: 28 } 
      ] 
     } 
     ] 
    }); 
    chart.render(); 
} 
</script> 
</head> 
<body> 
<div id="chartContainer" style="height: 300px; width: 100%;"></div> 
</body> 
</html>

我嘗試了幾種方法來調用代碼

data: [    
     { 
      // Change type to "doughnut", "line", "splineArea", etc. 
      type: "column", 
      dataPoints: [ 
       //insert here 
      ] 
     } 
     ]

，但我只拿到空白的屏幕和取消定義當我嘗試打開it.does人有任何指導我在這部分中我的新陣如何在數據點內調用我的數組？

我的數據是在不同的文件名爲task.json我得把它用

var input=require('./task.json'); 
const _ = require(`underscore`); 
var names=_.countBy(input,'operator');

來源

2016-12-24 bruno salapic

你想在數據點內調用哪個數組？ 'name？' – marmeladze

聲明一個新的變量（比如.dps）作爲** CanvasJS.chart **函數之外的數組。用數據填充該數組，以便在圖上顯示。數據應按照CanvasJS庫中的指示採用適當的格式。然後，將該var（dps）分配給** CanvasJS.chart **函數內的dataPoints。（例如：dataPoints：dps）。 – Beevk

是的，我想調用我的數據點內的名字 –

比方說，你的JSON對象存儲在一些變量（例如：myObject的）。

var myObject = {"john doe":2,"john doeeeeeeee":1};

聲明一個變量來存儲來自JSON的dataPoints並將dataPoints推送到您的數組中。

var dps = []; 
for(var element in myObject) { 
    dps.push({label: element, y: myObject[element]}); 
}

一旦你做到了這一點，這個變量（DPS）分配給數據點CanvasJS圖表。

data: [ 
    type: "column", 
    dataPoints: dps 
]

您可以在此fiddle中看到一個工作示例。

來源

2016-12-27 04:01:30 Beevk

採取一個對象的數組，並把它放在條形圖

回答

相關問題