echarts在不同的位置阴影点击事件点击同一个图获取的值都不一样?

kyle小哥 发布于 02/09 15:06
阅读 129
收藏 0

 

如图所示,通过getZr()点击事件触发事件的时候,点击同一事件的柱状图,在不同的位置得到的数据竟然是不一样的,请问是不是我的代码写的有问题,代码写法来自别人的实现。

如果直接使用onclick点击事件的画,可以获得对应柱状图在画板的索引值,但只能点中柱状图才能触发,点击阴影部分无效。9570.com_【官方首页】-澳门金沙反过来,如果用阴影点击事件,又拿不到对应的索引值。郁闷!

加载中
0
tcxu
tcxu

就"上证指数"来说, 我是门外汉。 但我的观察如下:

xIndex 索引都是 3980,表明点击的是同一事件(最 长/高 的 红)柱。

3帧不同的柱状图(1,2,3)中, 这个最长红柱在各自的图中的位置不一样,对应的数据 xData 自然9570.com_【官方首页】-澳门金沙不一样。

注意,无论是那一帧直方图,对应 xIndex 索引 3980 下的数据是一样的, 总是:

3980

(4) [9.19, 9.32, 9.16, 9.42]

kyle小哥
kyle小哥
9570.com_【官方首页】-澳门金沙他只是在图上的位置不同,但是同一天同一个柱状图,位置不同,数据不同,连索引也发生了改变。但如果用onclick事件点击柱状图触发的xindex是不会变的。 myChart.on('click', param => {})柱状图点击有效, myChart.getZr().on('click', params => {})阴影及柱状图点击有效,我要的效果 以上两个方法返回的参数params 内容不一样
0
tcxu
tcxu

写成以下代码试试。看是否可以保证 点击给定的这个红柱子,无论何时,xIndex 不变,进而 xData 也不会变。

myChart.getZr().on('click', params => {
    const pointInPixel = [params.offsetX, params.offsetY]
    if (myChart.containPixel('grid', pointInPixel)) {
    let xIndex = myChart.convertFromPixel({ seriesIndex: 0 }, [params.offsetX, params.offsetY])[0]
    //只要点击同一根柱子,无论何种情况,xIndex 都不变
    let op = myChart.getOption()
    var xData = op.series[0].data[xIndex] //因此,xData 也不变
    console.log(xData);    
              }
         }
    )

 

kyle小哥
kyle小哥
我已经解决了, 通过提示框的回调函数可以解决。😀😀谢谢呀,又劳烦你了。哥,可以跟你交个朋友吗?扣156790188
返回顶部
顶部

页面底部区域 foot.htm