javascript Chart.js - 绘制带有多个标签的条形图
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46608550/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Chart.js - Draw bar chart with multiple labels
提问by sf8193
I am trying to draw a bar chart with chart.js that uses multiple labels so that I can manipulate them. I have managed to do it with a line chart and tried extending what I did there with no luck. I am getting this error. what could be causing it?
我正在尝试使用使用多个标签的 chart.js 绘制条形图，以便我可以操作它们。我已经设法用折线图来完成它，并尝试扩展我在那里所做的事情，但没有运气。我收到此错误。是什么原因造成的？
"Uncaught TypeError: Object.defineProperty called on non-object".
“未捕获的类型错误：在非对象上调用了 Object.defineProperty”。
The issue is somewhere in the data: {} because when I had data as a simple 2 index array it was working fine.
问题出在数据中的某处：{} 因为当我将数据作为简单的 2 索引数组时，它工作正常。
edit: when stepping through dataset = null;
编辑：单步执行 dataset = null 时；
var com_passed = rows[rows.length-2]["# Common Passed"];
var com_failed = rows[rows.length-2]["# Common Failed"];
var ctx = document.getElementById("common_chart");
ctx.height = 50;
var historicalChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Passed", "Failed"],
datasets: [
{
data: com_passed,
label: "Passed",
fillColor: "red"
},
{
data: com_failed,
label: "Failed",
fillColor: "green"
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true,
responsive: false,
maintainAspectRatio: true
}
}]
}
}
});
采纳答案by sf8193
for those having a similar issue. I needed to make the data com_passed and com_failed as an array instead of an integer like so.
对于那些有类似问题的人。我需要将数据 com_passed 和 com_failed 作为数组而不是像这样的整数。
var com_passed = rows[rows.length-2]["# Common Passed"];
var com_failed = rows[rows.length-2]["# Common Failed"];
var ctx = document.getElementById("common_chart");
ctx.height = 50;
var historicalChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ["Passed", "Failed"],
datasets: [
{
data: [com_passed],
label: "Passed",
fillColor: "red"
},
{
data: [com_failed],
label: "Failed",
fillColor: "green"
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true,
responsive: false,
maintainAspectRatio: true
}
}]
}
}
});
