[Question] Creating tooltips based on selection

[legendre6891]

Thanks for your great work on Altair!

I have a question on how to create tooltips that depends on the selection in the legend. I modified the pivot transform example in the documentation and currently have this:

import altair as alt
from vega_datasets import data

source = data.stocks()
base = alt.Chart(source).encode(x='date:T')
columns = sorted(source.symbol.unique())

selection = alt.selection_single(
    fields=['date'], nearest=True, on='mouseover', empty='none', clear='mouseout'
)
legend_selection = alt.selection_multi(fields = ['symbol'], bind = 'legend')

lines = base.mark_line().encode(
    y='price:Q',
    color='symbol:N',
    opacity = alt.condition(legend_selection, alt.value(1), alt.value(0)),
).add_selection(legend_selection)

points = base.mark_point().encode(
        y = 'price:Q',
        color = 'symbol:N',
        opacity = alt.condition(legend_selection, alt.value(1), alt.value(0))
    ).transform_filter(selection)

rule = base.transform_pivot(
    'symbol', value='price', groupby=['date']
).mark_rule().encode(
    opacity=alt.condition(selection, alt.value(0.3), alt.value(0)),
    tooltip=[alt.Tooltip(c, type='quantitative') for c in columns]
).add_selection(selection)

plot = lines + points + rule
plot.save('a.html')

Result in Vega-lite editor

How could I make it so the tooltip displayed only shows those series which are currently active in the legend? Is this possible?

(I saw the related issue vega/vega-lite#1552, but the answer there doesn't seem to be directly applicable. (Not sure?))

Thanks!

[jakevdp]

I don't know of any way to change the tooltip fields based on a selection.

[legendre6891]

Ah that’s too bad! Do you know of another method to achieve something equivalent? Basically the tooltip could become a bit busy if there are many different series.

[ghost]

Text label could be a solution in this case. Here is an example

[sfc-gh-cheliu]

@jakevdp Do you mind if I make a PR to add this feature? Basically we want to filter out/hide zero/null values in the tooltip and possibly sort the tooltip by values. Could you give some pointers?

[joelostblom]

@sfc-gh-cheliu That feature would need to be contributed upstream to either the https://github.com/vega/vega-lite or https://github.com/vega/vega-tooltip repo. Feel free to open an issue there with your suggestion. I'm going to close this as there is nothign to do on the altair side of things

[sfc-gh-cheliu]

@joelostblom Thanks for the info. Just to double confirm, there's no way to modify altair to achieve this feature? I saw that there's a list of Tooltip objects specifying the fields/column names, can we modify some underlying logic so that if a field has zero or null value, don't let it appear in the tooltip? Or we need to modify https://github.com/vega/vega-lite instead?

[joelostblom]

It's possible that you could make that modification in Altair, but to me it sounds like this is a better fit for an upstream contribution to Vega-Lite. We generally want fixes like this to be implemented in vega-lite directly, but I'm not familiar enough with the Tooltip code itself to know if there is any special reason to do this in altair instead

[sfc-gh-cheliu]

@jakevdp @joelostblom I found that class Tooltip has a parameter called 'condition' and that might potentially satisfy the need of hiding zero/null values. However, when I try to specify it, I got a SchemaValidationError: Tooltip has no parameter named 'condition' Existing parameter names are: shorthand bin format title aggregate condition formatType type bandPosition field timeUnit See the help for Tooltip to read the full description of these parameters error. Why is this the case?

Also, if contributing to the upstream repo, which one is the best/do you recommend? https://github.com/vega/vega-lite/blob/4ba3b93e575df97ffe56713287b40d6c55b18340/src/compile/mark/encode/tooltip.ts in vega-lite or https://github.com/vega/vega-tooltip/blob/5f805fb8a6e76e3e58d2541e51b6106bcc133f11/src/Handler.ts in vega-tooltip?
I opened a new issue there for better discussion: vega/vega-lite#9152. Appreciate it if you could take look.

Thanks!

[joelostblom]

I am not sure what is going on there, could you post a reproducible example as a new issue? You can base it off https://altair-viz.github.io/gallery/scatter_tooltips.html

[sfc-gh-cheliu]

@joelostblom For the feature I want to add I've opened a new issue there.
Do you mean the repro for the error? It's easy - either selection_chart.encoding.tooltip[0].condition = alt.condition(alt.datum.type1 > 0, 'type1', alt.value('')) or specifying "tooltip": [alt.Tooltip('Date'), alt.Tooltip('type1:Q', condition=alt.condition(alt.datum.type1 > 0, 'type1', alt.value('')))] in the chart encoding will trigger this error. But my point is if we can add that feature we want, this doesn't matter. Also, based on what I found from the previous asks, even ifcondition works, the field may still appear in the tooltip. So I guess the best way is just to add that feature instead of using condition. It'd be great if you could take a look here vega/vega-lite#9152. Thank you!!

[joelostblom]

Thanks @sfc-gh-cheliu , Could you open a new issue in the altair repo regarding the tooltip not working with the condition although the docs say that it should? Your repro is good, we just need to track it in a separate issue.

I am not sure how much I can help on the Vega-Lite side of things, so let's see what reply you issue there gets from the core vega-lite developers.

[sfc-gh-cheliu]

Sure, I've opened a new issue for you to track here #3196. Thanks.