User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I'm designing the hover states for 2 charts, a bar chart and a line chart. Maybe I'm over thinking, but for both these charts I find there is an arrow alignment that would work better based on the type of the chart. Should they be point horizontally or vertically aligned?
For bar chart I think pointing horizontally would make sense at it doesn't cover the details on the bar. For the line chart I'm not sure which would be the better. What consideration should I make in order to decide these?
I think you should go with the top solution for both the bar and the line chart.
They are placed well enough to not hide any significant data for being shown.
I really don't like the bottom bar chart solution at all, especially since it covers the end of the bar, that is not a good solution at all.
For the bottom line chart I still think it covers to much of the data from being shown.
What if there's a data point at the bottom right? Where will the tooltip show then?
It is advisable to have different tooltip directions based on where your mouse is; so that the tooltip is visible at all times.
Top right area of your screen: Tooltip pointing top or top-right.
Top left area of your screen: Tooltip pointing top or top-left.
Bottom right area of your screen: Tooltip pointing bottom or bottom-right.
Bottom left area of your screen: Tooltip pointing bottom or bottom-left.
If chart readability is a very important aspect, allow users to turn off the tooltips as well in chart settings.
