最近在学习ECharts,关于ECharts的鼠标右键事件可以看官网ECharts3文档的API,网址:点这个网址直接跳转到官网API指定的鼠标事件中去 如下:
(/api.html#events.%E9%BC%A0%E6%A0%87%E4%BA%8B%E4%BB%B6)
在 ECharts 中主要通过 on 方法添加事件处理函数,如下:
myChart.on('contextmenu', function (params) {console.log("右键事件");console.log(params);});
怎么还是会出现默认的右击事件?
可以发现出来了效果,但遗憾的是还是会出现默认的右击事件,保存图片等,于是:
可以先屏蔽浏览器的右击事件,再调用ECharts的右击事件,如下:
//去除默认的鼠标事件document.oncontextmenu = function () { return false; }; //新加上鼠标右击事件myChart.on('contextmenu', function (params) {console.log("右键事件");console.log(params);});
PS:在我做的练习里,是画地图的,加载的是geoJSON格式的数据,我用params.data.name去访问我鼠标右击时具体对应的是我的geoJSON里的数据,再去后台获取更多的数据传递到前台里。