search

apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.82k stars 19.63k forks source link

[Feature] tooltip.appendToBody with no scroll #17625

Open DavidMarquezF opened 2 years ago

DavidMarquezF commented 2 years ago

What problem does this feature solve?

I'm using tooltip.appendToBody = true in order to be able to see all the tooltips properly. Everything works perfectly until I hover over a chart that's nearly outside of the screen. image

As you can see it overflows the body and therefore creates s scrollbar in the html element. In this screen the charts are inside a container with inner scroll, so it kind of messes up the scroll because the user can scroll outside the view: image

Maybe it would be good to create the tooltip div inside of a relative layout that doesn't exceed the body size:

<body>
.....
  <div style="position: relative; width: 100%; height: 100%; overflow: hidden">
         <div style="position:absolute">the tooltip as it is now</div>
  </div>
</body>

What does the proposed API look like?

Add an option:

{
   tooltip: {
       appendToBodyConfine: boolean
    }
}

which will add the overflow: hidden property to the tooltips parent container

github-actions[bot] commented 3 months ago

This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.

DavidMarquezF commented 2 months ago

This is still relevant :)