JavaScript缩放图表功能

Question

我编写了一个java脚本代码，用于在完成之后跟踪折线图我需要修改我的代码以允许通过鼠标选择和平移画布进行缩放

function zoom(){
    startindex = document.getElementById("startpoint").selectedIndex;
    endindex= document.getElementById("endpoint").selectedIndex;
    var newlabels=oldlabels.slice(startindex, endindex);
    var newdata=oldDatas.slice(startindex,endindex);
    data.labels= newlabels;
    data.datasets.data=newdata;
    myChart = new Chart(context).Line(data);
 }

the link to my chart

Answer 1

了解context.translate和context.scale方法。

了解这些将让你平移和放弃放大。

缩放的基础是：

• 转换为您要放大的点
• 将画布缩放到所需的缩放级别
• 擦除画布
• 在-chartWidth / 2和-chartHeight / 2处重绘图表。

潘更容易：

• 按您要平移的x距离进行翻译
• 擦除画布
• 将图表重新绘制为0,0