echats鼠标滑动,连续修改点的位置
定义图表
myChart.value = markRaw(echarts.init(document.getElementById("theEcharts")));
myChart.value.setOption(options.value);
监听鼠标按下,监听鼠标移动,监听鼠标抬起
// 加条件判断,按下后滑动才能改变图表
let etype = 0
myChart.value.getZr().on('mousedown', ()=>{
etype=1
})
myChart.value.getZr().on( 'mousemove',function(params){
if(etype){
const data = myChart.value.convertFromPixel('grid', [params.offsetX, params.offsetY])
if(timearr.includes(data[0])){
options.value.series[1].data[data[0]]=data;
tableData1.value.forEach((e, i) => {
if(data[0] == i){
e.q = Number(data[1].toFixed(1))
}
})
myChart.value.setOption(options.value);
}
}
})
myChart.value.getZr().on('mouseup', ()=>{
etype=0
})
可实现鼠标联系滑动修改图表点的位置
文笔不好,自己做记录用的,有需要的可以拿去用
浙公网安备 33010602011771号