我试图在Chart.js 2.3.0中的一个图上显示两组数据,使用HTML文件触发js函数来更新包含数据的全局数组,然后使用Chart.js进行绘制。但是,我注意到一个数据集的图更新,而另一个数据集没有。
错误不在于生成数据本身,因为成功绘制的数据值依赖于未成功绘制的值。数据似乎是正确的(根据断点进行判断并在控制台中始终打印数据),并存储在正确的数组中,只是其绘制方式不如副本中的数据正确。生成未绘制数据的js是
function upDataPol() //Updates the global array "polData" with data generated by genP_z
{
//The variable "B" used in genP_z is picked randomly from a M-B probability distribution
var B = randn_MB();
polData = genP_z(polData, B);
}
成功的数据来自:
function upDataKT() //Updates the "KTdata" and "KTnorm" arrays' values
{
//Each member of KTdata is increased by the corresponding value stored in polData
KTdata = addToData(KTdata, polData);
for (i = 0; i < KTdata.length; i++)
{
//takes the total KT data and normalises it according to the "noted" number of runs,
//then stores it
KTnorm[i] = KTdata[i]/note;
}
}
Chart.js是:
var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx,
{
type: 'line',
data:
{
labels: time,
datasets:
[
{ //Data is drawn from the polData array and, below, the KTnorm array
data: polData,
label: "Polarisation",
borderColor: "#8e5ea2",
fill: false,
pointRadius: 1,
pointHitRadius: 0
},
{
data: KTnorm,
label: "KT",
borderColor: "#3e95cd",
fill: false,
pointRadius: 1,
pointHitRadius: 0
}
]
},
options:
{
scales:
{
yAxes:
[{
ticks:
{
suggestedMax: 1,
suggestedMin: -1/3,
stepSize: 1/3
}
}]
}
}
});
最后,用于更改数据并更新绘图的按钮的HTML:
<a href="#" onclick="upDataPol(); myChart.update();">Click Here to show and add one polarisation function</a><br>
<a href="#" onclick="upDataKT(); myChart.update();">Click Here to update the K-T function</a><br>
我是js的新手,因此可以提供任何帮助:)