为什么 echarts的 click 事件必须得点击到某一个数据的原点位置才可以触发呢? 不应该是点到图表上的任意位置 就会触发click事件吗?求解决,因为用到了事件。
还有一个问题 我通过getZr() 这个方法拿到了全局的click事件 但是我该怎么获取到 当前我点的地方的那个数据呢? 线图问题。
我结合我的使用经验尝试给你解答,但正确性有待考量,但是就目前而言可以解决问题;
问题1:点击图表实体部分(如数据点,饼,柱等)才会触发click,空白部分不触发;
问题2:我一般绑定两个click事件,一个在echart实例上,一个在getZr()上,前者无需多言,后者getZr().click触发时,会传递event对象,而这个对象的target应该就是鼠标点击的实体对象或者空白部分,当点击实体对象时它不为空,点击空白部分时它为undefined;由此可做进一步的判断和逻辑处理。
myChart.getZr().click(function(event){
if(!event.target){ console.log("点击空白处"); }
})
我可以绑定两个事件 但是,当他触发了全局的事件的时候event.target 这个方法一定是undefined,其实最终还是必须要点击到某一个数据点上才可以拿到当前的数据。所以这个方法不太好用。我读了点击事件的源码,当点击到除了点的位置 event里都是获取不到target的,但是我不太清楚为什么 tooltip 这个插件为什么可以只要点击charts表上 就可以获取到当前的数据点。
@Jackie-Web 遇到同样的问题,之前用 echart2 的时候,修改 2 的代码来实现了这个,现在用 3 了,也需要这样的功能,结果不知道怎么弄,求官方解答~
@Jackie-Web @imingyu 目前我这里的解决办法有两种:
showTip 事件,每次全局记录一个 lastTipIndex,存储最后一次 tooltip 显示的位置的坐标位置。click 事件,然后使用上面的 lastTipIndex 数据做自己的操作。lastTipIndex。lastTipIndex 数据做自己的操作。两种方法都绕路实现楼主的需求,目前我们这么做的。其他chart 似乎都有这个功能,只有 echart 没有,而且是 2 和 3 都没有。
感谢 @hustcc @flyYoyo :sparkles:。
遇到了同样的问题,timeline的前进后退键的点击事件无法捕获,真的耽误事啊。
@hustcc 其实都有问题,zr监听的是全局点击事件。如果记录了lastTipIndex后,点击了非数据图的位置也会响应
可以配合hideTip事件清空lastTipIndex
var lastTipIndex = null;
chart.on('showTip', function(event) {
lastTipIndex = event.dataIndex;
});
chart.on('hideTip', function(event) {
lastTipIndex = null;
});
chart.getZr().on('click', function() {
if (dataIndex != null) {
// 执行点击事件动作
}
});
回传到父组件的函数还是触发不了啊
我可以绑定两个事件 但是,当他触发了全局的事件的时候event.target 这个方法一定是undefined,其实最终还是必须要点击到某一个数据点上才可以拿到当前的数据。所以这个方法不太好用。我读了点击事件的源码,当点击到除了点的位置 event里都是获取不到target的,但是我不太清楚为什么 tooltip 这个插件为什么可以只要点击charts表上 就可以获取到当前的数据点。
同问
我可以绑定两个事件 但是,当他触发了全局的事件的时候event.target 这个方法一定是undefined,其实最终还是必须要点击到某一个数据点上才可以拿到当前的数据。所以这个方法不太好用。我读了点击事件的源码,当点击到除了点的位置 event里都是获取不到target的,但是我不太清楚为什么 tooltip 这个插件为什么可以只要点击charts表上 就可以获取到当前的数据点。
同问
点击空白处时,之前柱状图的选中状态会消失。怎样才能使点击了空白处后,选中状态不消失?
Most helpful comment
@Jackie-Web @imingyu 目前我这里的解决办法有两种:
一、showTip 事件
showTip事件,每次全局记录一个lastTipIndex,存储最后一次 tooltip 显示的位置的坐标位置。click事件,然后使用上面的lastTipIndex数据做自己的操作。二、tooltip formatter
lastTipIndex。lastTipIndex数据做自己的操作。两种方法都绕路实现楼主的需求,目前我们这么做的。其他chart 似乎都有这个功能,只有 echart 没有,而且是 2 和 3 都没有。
感谢 @hustcc @flyYoyo :sparkles:。