How to programmatically show a tooltip with either show: false or trigger: 'none'?

Question

The docs say that if tooltip.trigger: 'none' that the tooltip can be displayed by calling dispatchAction with type 'showTip'. But I cannot seem to get that to work. Does anyone have a snippet of working code that uses the showTip action and can show how their tooltip is configured to make this work?

I have tried with both {show: false, trigger: 'axis'} and with {show: true, trigger 'none'}. In both cases, the showTip action does nothing.

The reason I can't just use the default axis trigger {show: true, trigger: 'axis'} is because it breaks series highlighting (a bug, I assume). So I'm trying to find a way to display the tooltip anywhere the mouse goes on the chart, but without disabling highlighting.

**UPDATE: I finally gave up on EChart tooltips and ended up just creating my own. Positioning information can be obtained using the ZRender component in this way:

chartObj.getZr().on('mousemove', e => {

   // mouse position within chart, in pixels
   const pointInPixel = [e.offsetX,e.offsetY]
})

Sergey Fedorov · Accepted Answer · 2021-03-21 10:22:46Z

0

You have chosen the most difficult way. To show/hide tooltip you need update state of Instance:

instance.setOption({ tooltip: {show: true }}) // or show: false

answered Mar 21, 2021 at 10:22

Sergey Fedorov

4,4902 gold badges20 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Max Over a year ago

can the chart does not reload/refresh after set option?

Collectives™ on Stack Overflow

How to programmatically show a tooltip with either show: false or trigger: 'none'?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related