在 chart.js 上平移也可以放大折线图答案

【问题标题】：pan on chart.js also zoom on line charts在 chart.js 上平移也可以放大折线图
【发布时间】：2017-11-29 08:07:01
【问题描述】：

我想用 chartjs-plugin-zoom 平移和缩放折线图。问题是当我使用平移时，它也会放大图表直到只剩下一个标签，当图表模型是条形时没有问题。我怎么解决这个问题？我希望平移只是平移而不是缩放。这是一个适用于条形图但不适用于折线图的小提琴： https://jsfiddle.net/pfd2on55/

var ctx = document.getElementById("canvas").getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
  labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sept'],
  datasets: [{
     label: '# of Votes',
     data: [12, 19, 3, 5, 2, 5, 9, 4, 11]
  }]
},
options: {
  pan: {
     enabled: true,
     mode: 'x',
  },
  zoom: {
     enabled: true,
     mode: 'x',
   }
   }
  });

【问题讨论】：

标签： plugins zooming chart.js hammer.js

【解决方案1】：

我通过编辑 Chart.Zoom.js 文件的 panIndexScale 函数解决了这个问题。我把
var offsetAmt = Math.max((scale.ticks.length - ((scale.options.gridLines.offsetGridLines) ? 0 : 1)), 1);改成

var offsetAmt = Math.max((scale.ticks.length - 0), 1);

现在平移和缩放可以正常工作。

【讨论】：