Javascript 图表js和x3000;如何同步平移和放大多个聊天
我想在多个图表上同步平移和缩放。 我一直在使用Chart.js和chartjs插件zoom charjs插件zoom使用onZoom回调函数调用事件。那么,价值观呢在X轴的两端通过回调函数以这种方式获得Javascript 图表js和x3000;如何同步平移和放大多个聊天,javascript,charts,chart.js,chartjs-plugin-zoom,Javascript,Charts,Chart.js,Chartjs Plugin Zoom,我想在多个图表上同步平移和缩放。 我一直在使用Chart.js和chartjs插件zoom charjs插件zoom使用onZoom回调函数调用事件。那么,价值观呢在X轴的两端通过回调函数以这种方式获得 onZoom: function () { var minVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[0].time; var maxVal = myChart
onZoom: function () {
var minVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[0].time;
var maxVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[1].time;
leftEnd = minVal;
rightEnd = maxVal;
updateChart();
}
然后使用updateChart函数更新图表
onZoom: function () {
var minVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[0].time;
var maxVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[1].time;
leftEnd = minVal;
rightEnd = maxVal;
updateChart();
}
我认为其他图表应该用这些值进行更新由updateChart函数获得的X轴两端的。
使用Chart.helpers.each调用update()以更新所有图表
function updateChart() {
Chart.helpers.each(Chart.instances, function (instance) {
instance.oprions = {
scales: [{
xAxes: {
time: {
min: leftEnd,
max: rightEnd
}
}
}]
};
instance.update();
});
}
然而,没有取得预期的结果。
缩放平移仅反映所操作的图表
我认为onZoom回调函数可以同时获取X轴的边缘,并在每一帧更新图表。
图表只能使用选项更新,因此Chart.helpers.each可用于一次更新所有图表。如果要更新的X轴两端都是全局变量,则可以引用所有图形
这个方法不对吗?
选项更新方法是否错误?更新时间是否错误
更新 我通过参考找到了更新图表的方法 实际上,多个图表的X轴比例范围已经改变,但max再次缩放并停止工作 原因是不更新引用。 是什么? 示例代码写为“需要更新引用”作为注释。 什么意思 下面调用的示例代码:
xScale = chart.scales['newId'];
“newId”被重新指定为scales id
但我的是刻度的最小值和最大值。
怎么做
我知道怎么做了。如果我知道这没什么大不了的 回调函数updateChart()应如下所示:
function updateChart() {
Chart.helpers.each(Chart.instances, function (instance) {
instance.options.scales.xAxes[0].time.min = leftEnd;
instance.options.scales.xAxes[0].time.max = rightEnd;
instance.update();
});
}
关键是我的数据是时间序列数据,所以比例选项应该是使用“时间”
已更新