crie um gráfico de várias linhas usando o Chart.js
Estou tentando criar um gráfico de várias linhas usando o Chart.js
Eu posso fazer isso para 1 linha e eu posso fazer 2 linhas usando uma estrutura de dados fixa, mas não consigo obter várias linhas para exibir dados passados para a estrutura de dados.
Aqui está o exemplo de uso abreviado do site chart.js
http://www.chartjs.org/docs/#getting-started
var myLineChart = new Chart(ctx).Line(data);
var data = {
labels: ["January", "February", "March", "April", "May", "June", "July"],
datasets: [
{fillColor: "rgba(220,220,220,0.2)",
strokeColor: "rgba(220,220,220,1)",
data: [65, 59, 80, 81, 56, 55, 40]
},
{fillColor: "rgba(151,187,205,0.2)",
strokeColor: "rgba(151,187,205,1)",
data: [28, 48, 40, 19, 86, 27, 90]
}
]};
agora meu código
lineChartData = {}; //declare an object
lineChartData.labels = []; //add 'labels' element to object (X axis)
lineChartData.datasets = []; //add 'datasets' array element to object
dataset = {}; //a single dataset is an object
dataset.fillColor = "rgba(0,0,0,0)";
dataset.strokeColor = "rgba(200,200,200,1)";
dataset.data = []; //contains the 'Y; axis data
for (line = 0; line < 4; line++) {
y = [];
lineChartData.datasets.push(dataset); //create a new line dataset
for (x = 0; x < 10; x++) {
y.push(line + x); //push some data aka generate 4 distinct separate lines
lineChartData.labels += x; //adds x axis labels
} //for x
lineChartData.datasets[line].data = y; //send new line data to dataset
} //for line
ctx = document.getElementById("Chart1").getContext("2d");
myLineChart = new Chart(ctx).Line(lineChartData);
}
o gráfico sempre exibe a mesma última linha gerada 4 vezes.
Eu sou novo no javascript e tenho certeza de que estou fazendo algo errado com a criação da estrutura do objeto. Passei um dia tentando resolver isso
existe uma opção chart.js para adicionar valores da seguinte forma, devo usar este
.addData (valuesArray, label)