我是 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}
因此，对于下一部分，我将使用我在网上找到的示例 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
]
}
]
但是当我尝试打开它时，我只会看到空白屏幕并取消定义。有人可以指导我如何在数据点中调用我的数组吗？
我的数据位于另一个名为 task.json 的文件中，我必须使用它来调用它
var input=require('./task.json');
const _ = require(`underscore`);
var names=_.countBy(input,'operator');
最佳答案
比方说，您的 JSON 对象存储在某个变量中(例如:myObject)。
var myObject = {"john doe":2,"john doeeeeeeee":1};
声明一个变量来存储 JSON 中的数据点并将数据点推送到数组中。
var dps = [];
for(var element in myObject) {
dps.push({label: element, y: myObject[element]});
}
完成此操作后，将此变量 (dps) 分配给 CanvasJS 图表的数据点。
data: [
type: "column",
dataPoints: dps
]
您可以在 fiddle 中看到一个工作示例.
关于javascript - 获取一个对象数组并将其放入条形图中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41309475/