我正在尝试使用使用多个标签的 chart.js 绘制条形图,以便我可以操作它们。我已经设法用折线图来完成它,并尝试扩展我在那里所做的但没有运气。我收到此错误。是什么原因造成的?
"Uncaught TypeError: Object.defineProperty called on non-object".
问题出在数据的某处:{} 因为当我将数据作为一个简单的 2 索引数组时它工作正常。
编辑:单步执行 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
}
}]
}
}
});
最佳答案
对于那些有类似问题的人。我需要将数据 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
}
}]
}
}
});
关于javascript - Chart.js - 绘制带有多个标签的条形图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46608550/