Question

我使用Chart.js和Zoom插件构建了一个折线图。这一切都很好，它很好地平移和缩放，但是，图表总是加载完整的数据范围，我希望它开始“缩放”n量。我试图调整设置，但无济于事。在这个阶段的任何指针都将非常感激。

Answer 1

最后解决了这个问题。

在缩放选项部分中，您需要在与缩放功能一起使用时添加一个最小整数，然后仍然将图形渲染到画布之外，准备进行平移。

scales: {
         xAxes:[
                 {
                    type: 'time',
                    time: {
                    min: '2',
                    tooltipFormat: 'll',
                    displayFormats: {
                    quarter: 'MMM YYYY',
                }
            },

只要你的＆＃34; Type＆＃34;是时候这对我有用了。

Answer 2

ChartJS没有内置的setZoom方法。总结ChartJS缩放插件限制的问题：https://github.com/chartjs/chartjs-plugin-zoom/issues/82

这是一种将鼠标滚轮事件发送到图表并进行缩放的黑客方式：

let e = document.createEvent('MouseEvents')
e.initEvent('wheel', true, true)
e.deltaY = -10e20;
setTimeout(() => {
  for(let i=0;i<70;i++)
    canvas.dispatchEvent(e);
}, 500);

希望这会有所帮助。

Chart.js缩放从放大开始

2 个答案: