问题描述
我对javascript还是很陌生,这使我无法自拔。我敢肯定这确实很简单,但是由于某种原因,我似乎无法正常工作。我曾在stackoverflow上看到过类似的问题,但我无法让它们为我工作。
I'm still fairly new to javascript and this has got me banging my head against the wall. I'm sure it's really simple but for some reason I cannot seem to get this working correctly. I have seen similar questions on stackoverflow but I can't make them work for me.
我试图将未知数量的数据集绘制到Chartjs图上。我能够获取数据(使用PHP将其作为画布子元素上的数据属性输出)并将它们存储到变量$ rows中。
I am trying to plot an unknown number of datasets onto a Chartjs graph. I am able to get the data (using PHP it is output as data attributes on child elements of the canvas) and store them to a variable $rows.
var $rows = $('#graphCanvas').find('> div')
然后我遍历行并计算数据集。
I then iterate through the rows and calculate the dataset.
var colors = [ '#2685CB', '#4AD95A', '#FEC81B', '#FD8D14', '#CE00E6', '#4B4AD3', '#FC3026', '#B8CCE3', '#6ADC88', '#FEE45F' ];
for (var i=0; i<$rows.length; i++) {
datasetdata[i] = {
label:"Test " + i,
data: getdata($rows[i]),
backgroundColor: colors[i],
hoverBackgroundColor: colors[i],
borderStyle: 'solid',
borderWidth: 2,
}
}
function getdata($rows) {
//returns raw data
}
这一切都很好,但是当我尝试使用 datasetdata
This all works well however the problem starts when I try to use datasetdata
var graphContext = document.getElementById("graphCanvas").getContext("2d");
var graphData = {
labels: labels,
datasets: [datasetdata]
};
如果我将其与索引一起使用,则可以正常工作: datasetdata [0]
If I use it with an index it works fine: datasetdata[0]
如果我可以确定有多少个数据集,我可以添加它们的索引,这样就可以了。
If I knew for sure how many datasets there would be I could just add their indexes and it would be fine.
任何对我正在做错事的了解都是很好的
Any insight into what I'm doing wrong would be great
推荐答案
问题:
您在 datasetdata
变量周围有另外一组括号。
Problem:
You have an extra set of brackets surrounding the datasetdata
variable.
删除括号并将数据集
设置为 datasetdata
:
var graphData = {
labels: labels,
datasets: datasetdata
};
解释:
datasets
选项接受一个参数,该参数是数据集对象的数组。所需的结构如下:
Explanation:
The datasets
option accepts a parameter that is an array of dataset objects. The wanted structure looks as following:
datasets: [
{ dataset1 },
{ dataset2 }
]
在代码中,您包围了 datasetdata
通过一组括号:
In your code, you surrounded the datasetdata
by a set of brackets:
var graphData = {
labels: labels,
datasets: [datasetdata]
};
通过添加另一组括号,您基本上是在设置数据集
到包含 datasetdata
数组的数组。该代码呈现的结果如下所示:
By adding another set of brackets, you are basically setting datasets
to an array which contains the datasetdata
array. The code renders a result that looks as following:
datasets: [
[ { dataset1 }, { dataset2 } ]
]
如果添加,请在特定索引处选择数组的值从 datasetdata
数组中提取单个数据集。
If you add select the value of the array at a specific index, you are extracting a single dataset from the datasetdata
array.
var graphData = {
labels: labels,
datasets: [datasetdata[0]]
};
那么您的结构就是其中具有单个数据集的数组:
Your structure is then an array with a single dataset inside it:
datasets: [
{ dataset1 }
]
此代码不会抛出错误,因为结构有效,但是只会显示第一个结果。
This code won't throw and error, since the structure is valid, however, it will only display the first result.
这篇关于在Chart.js中使用未知数量的数据集的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!