Mosaic plots: tooltips for y-axis should all point in the same direction

[danicahelb]

The mosaic plot y-axis tooltips sometimes point in different directions, which is confusing and hard to read. please make all of the tooltips point in the same direction for each mouseover. Please fix this for both RxC and 2x2 mosaics

[moontrip]

Hi @danicahelb I have examined plotly's options to see whether the mouseover tooltip's direction can be controllable, however, I could not find it out: it is automatically determined by plotly, thus no specific way to control the tooltip direction. Looked into other plausible options to alleviate this, and I found that there existed a unified tooltip, which shows single tooltip with both contents. For your better understanding, I made a screenshot in the following with the same example above. Thus, I wonder whether this option is better than the current one. What do you think?

[danicahelb]

hey @moontrip yes i think this is better. is it possible to add an arrow to clarify what the tooltip is pointing to? (see screenshots of other viz tool tooltips, below)

is it possible to also highlight the x-axis label that goes along with the tooltip? some ideas, in order of my preference, could be (using your above example):

1. Adding a header (ie, "Wave 7") to the tooltip (see histogram, with overlay)
2. making "Wave 7" bold and using a thicker line to point to it
3. Putting "Wave 7" right after the tooltip (see scatterplot, with overlay)

Adding a header, as per histogram looks like this:

Putting a label after the tooltip, as per scatter looks like this:

[danicahelb]

I made this ticket to unify tooltip styling for visualization data more consistent in the future: https://github.com/VEuPathDB/web-components/issues/453

Unifying styling won't happen for a while. I'm assuming it is easy to change the styling / order of the info in the tooltips in the future?

[moontrip]

hey @moontrip yes i think this is better. is it possible to add an arrow to clarify what the tooltip is pointing to? (see screenshots of other viz tool tooltips, below)

is it possible to also highlight the x-axis label that goes along with the tooltip? some ideas, in order of my preference, could be (using your above example):

1. Adding a header (ie, "Wave 7") to the tooltip (see histogram, with overlay)
2. making "Wave 7" bold and using a thicker line to point to it
3. Putting "Wave 7" right after the tooltip (see scatterplot, with overlay)

Adding a header, as per histogram looks like this:

Putting a label after the tooltip, as per scatter looks like this:

@danicahelb Thank you for your suggestions. Here are my answers for your several questions. a) For your first question, "adding arrow", I can say that it cannot be done in this case. Adding/showing arrow is a plotly's built-in/auto-generated feature for single marker/data point. What I have done above was a kind of grouping, which involves multiple markers/data points, thus understandably that it does not show arrow. However, I guess that plotly considered this case in a way by showing a dotted vertical line to the corresponding x-axis label when a mouseover occurs. Please refer to my previous screenshot or below one.

b) for the second question, "highlighting label", unfortunately, it is not feasible because the tooltip is made by plotly's built-in feature and the (elbow) label was a product of manual implementation (by Connor). Accordingly, those two are mutually independent and no specific way to highlighting label.

c) Third question, "adding x-axis label text at tooltip". Again, please keep in mind that this is grouped tooltip and No and Yes are independent without grouping at tooltip. Thus, all I could do is to add the x-axis label at each item, No or Yes in this example, as shown in the following screenshot. Is it okay for you?

d) for your information about your two screenshots of other Vizs' tooltip text style, the histogram one is made of a manual tooltip text and the scatter plot one is a default tooltip text style at plotly without specifying tooltip texts. So, if one sets up a manual text to the Scatter plot, then yes it can be similar to the histogram one, I suppose.

[danicahelb]

thanks @moontrip your solution of adding the x-axis label next to each value in the tooltip is a good one.

[moontrip]

thanks @moontrip your solution of adding the x-axis label next to each value in the tooltip is a good one.

Thank you for your confirmation, @danicahelb 👍 I will make a PR with above implementation.

[moontrip]

close this ticket as relevant PRs are merged

[nkittur-uga]

Works as expected. QA is complete.