7
回答
echarts如何将tooltip的Hover事件改为点击事件
【寻找人气王】邀新用户免费体验华为云服务,百元话费等你拿!   

我如何才能把鼠标悬浮弹出tooltip提示框改为鼠标点击弹出tooltip提示框。

举报
冥羽
发帖于3年前 7回/14K+阅
共有7个答案 最后回答: 1年前

tooltip: {

 enterable:true

}

--- 共有 2 条评论 ---
花花阿姨回复 @冥羽 : 知道啦!series.markPoint有clickable属性,你去研究一下喽 3年前 回复
冥羽不是啊,我的意思是当我点击图表上的某个节点时,弹出tooltip提示框,而不是当我鼠标经过某个节点时弹出tooltip提示框。你这个是鼠标可以进入tooltip提示框并点击提示框内部的信息。跟我的要求不一样 3年前 回复

引用来自“neu_dwc”的评论

点击事件中 调用 shouTip 就可以了
你好。可以具体问下showTip如何调用它吗?。我myChart.showTip(参数)或者其他总是提示无此函数。

引用来自“曼丽”的评论

tooltip: {

 enterable:true

}

您好。我就是想实现 点击 tooltip提示层里面的内容。我在里面写了html,但是这个tooltip总是很快就消失,或者鼠标移动就消失了。

可以这样修改,使用tooltip的triggerOn属性

 

tooltip.triggerOn string

[ default: 'mousemove|click' ]

提示框触发的条件,可选:

  • 1, 'mousemove'

    鼠标移动时触发。

  • 2, 'click'

    鼠标点击时触发。

  • 3, 'mousemove|click'

    同时鼠标移动和点击时触发。

  • 4, 'none'

    不在 'mousemove' 或 'click' 时触发,用户可以通过 action.tooltip.showTip 和 action.tooltip.hideTip 来手动触发和隐藏。也可以通过 axisPointer.handle 来触发或隐藏。

该属性为 ECharts 3.0 中新加。

这样,你鼠标点击之后tooltip就显示了。

 

可以这么代码可以这么写

 

tooltip: {
    show: true,
    formatter: function(e) {
        // return e.data.displayname;
        return 'hello';
    },
    // position: [500, 10],
    triggerOn: 'click'
},

点解之后调用formatter函数,然后显示hello,可以在里面定义你自己的函数,记得把tooltip添加到option里面。

--- 共有 1 条评论 ---
jungleboymark 5个月前 回复
顶部