If you have a blazor chart that fills the browser window tooltips will change their display so it is to the left of the mouse when approaching the right hand side of the chart and is above the top of the mouse when approaching the bottom of the chart so one can always see the tooltip. However, if you put a div to the right or the bottom of the chart the tooltip now disappears under the adjacent div (i.e. show two charts together). It is as if the tooltip cant recognize that the mouse is near the edge of the chart anymore.
My question is there a way to get the tooltips to behave correctly when there are adjacent divs.
Hello Richard,
I have been investigating into the behavior you are seeing and discussing this behavior with my teammates, and at the moment, the tooltips of the DataChart component in Ignite UI for Blazor does its hit-detection relative to the browser window and not the edge of the chart / div it is contained within. As such, it essentially does not know about the other div that would be to the right of your chart in this case.
My best recommendations on this matter would first be to potentially place some space (margin) between your divs such that there is enough space for the tooltip to appear without overlapping the other div / chart. Another option may be to utilize the different tooltip layers, as these may show up more reliably for you. You can see the different tooltip layers that are supported for the different category series at this documentation article.
Please let me know if you have any other questions or concerns on this matter.