pan on chart.js also zoom on line charts

本秂侑毒 提交于 2020-01-05 08:11:59

问题


I want to pan and zoom on a line chart with chartjs-plugin-zoom. The problem is that when I use pan it also zoom on chart till just one label remains, there is no problem when chart model is bar. how can I solve this problem? I want pan just to pan not zoom. this is a fiddle that works for bar chart but not works correctly for line chart: 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',
   }
   }
  });

回答1:


I solved this problem by editing function panIndexScale of file Chart.Zoom.js. I changed
var offsetAmt = Math.max((scale.ticks.length - ((scale.options.gridLines.offsetGridLines) ? 0 : 1)), 1); to

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

now pan and zoom work correctly.



来源:https://stackoverflow.com/questions/47547854/pan-on-chart-js-also-zoom-on-line-charts

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!