如何在使用ECharts DataZoom组件拖动图表时，鼠标指针离开图表取消拖动状态？

Question

由于ECharts中DataZoom组件拖动时鼠标指针离开图表不取消拖动状态，鼠标指针再度进入图表时，即使没有按住左键，图表也会跟随指针移动。例如这个官方demo中也有类似情况http://echarts.baidu.com/exam...一般来说，如果自己撸类似的功能的话可以在mouseleave之类的事件中处理相关问题，然而刚才翻了一下ECharts以及ZRender的源码，似乎是由于ZRender无法响应mouseleave，导致ECharts也没响应mouseleave事件不知道有没有什么办法可以解决这个问题，望不吝赐教

Answer 1

在 mouseleave 时手动 dispatch 一个 mouseup 到 canvas 元素即可

var mouseEvent= document.createEvent('MouseEvents');
mouseEvent.initEvent('mouseup', true, true);
echartsCanvasEle.dispatchEvent(mouseEvent);