平移chart.js还会放大折线图 [英] pan on chart.js also zoom on line charts
问题描述
我想使用chartjs-plugin-zoom平移和缩放折线图。问题是,当我使用平移时,它还会放大图表,直到只剩下一个标签,而当图表模型为条形时则没有问题。我怎么解决这个问题?我想要平移只是平移而不缩放。
这是一个条形图,适用于条形图,但不适用于折线图:
https: //jsfiddle.net/pfd2on55/
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',
}
}
});
推荐答案
我通过编辑文件Chart的panIndexScale函数解决了这个问题.Zoom.js。我更改了
var offsetAmt = Math.max((scale.ticks.length-((scale.options.gridLines.offsetGridLines)?0:1)),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.
这篇关于平移chart.js还会放大折线图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!