有时候,开发者需要监听画布的“空白处”所触发的事件。比如,当需要在用户点击“空白处”的时候重置图表时。
在讨论这个功能之前,我们需要先明确两种事件。zrender 事件和 echarts 事件。
myChart.getZr().on('click', function(event) {
// 该监听器正在监听一个`zrender 事件`。
});
myChart.on('click', function(event) {
// 该监听器正在监听一个`echarts 事件`。
});
zrender 事件与 echarts 事件不同。前者是当鼠标在任何地方都会被触发,而后者是只有当鼠标在图形元素上时才能被触发。事实上,echarts 事件是在 zrender 事件的基础上实现的,也就是说,当一个 zrender 事件在图形元素上被触发时,echarts 将触发一个 echarts 事件给开发者。
有了 zrender 事件,我们就可以实现监听空白处的事件,具体如下:
myChart.getZr().on('click', function(event) {
// 没有 target 意味着鼠标/指针不在任何一个图形元素上,它是从“空白处”触发的。
if (!event.target) {
// 点击在了空白处,做些什么。
}
});
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。