Altair: how do I get the values from a dropdown menu - altair

Question

Here is the code for generating the image:
input_dropdown = alt.binding_select(options=['Brand','Function','Category'])
selection = alt.selection_single(name='Color By', fields=['categories'], bind=input_dropdown)
alt.Chart(df_PCs).mark_circle().encode(x="PC1:Q", y="PC2:Q", color="Function:N", tooltip=['Name']).add_selection(selection)
What I want to do is to color the dots either by Brand, Function or Category whatever the value that comes from the dropdown menu. Is there a way to get the value of the dropdown menu? Such as selection.value()?

Answer 1

The best approach to this is similar to the Vega-Lite answer in Dynamically Change Y-Axis Field in Encoding Based on Selection Vega-Lite
Selections cannot filter on column titles, only on column values. Fortunately, you can use the fold transform to stack multiple columns and turn those column names into column values.
Here is an example of a Fold Transform in conjunction with a selection box to choose which column to color by:
import altair as alt
import pandas as pd
import numpy as np
df = pd.DataFrame({
'x': np.random.randn(100),
'y': np.random.randn(100),
'c1': np.random.randint(0, 3, 100),
'c2': np.random.randint(0, 3, 100),
'c3': np.random.randint(0, 3, 100),
})
selector = alt.selection_single(
name='Color by',
fields=['column'],
bind=alt.binding_select(options=['c1', 'c2', 'c3']),
init={'column': 'c1'}
)
alt.Chart(df).transform_fold(
['c1', 'c2', 'c3'], as_=['column', 'value']
).transform_filter(
selector
).mark_point().encode(
x='x:Q',
y='y:Q',
color='value:Q',
column='column:N'
).add_selection(
selector
)
For your data, it might look like this (though I've been unable to test it because the data is not included in the question)
selection = alt.selection_single(
fields=['column'],
bind=alt.binding_select(
name="Color by: ",
options=['Brand','Function','Category']
),
init={'column':'Function'}
)
alt.Chart(df_PCs).transform_fold(
["Brand", "Function", "Category"],
as_=['column', 'value']
).transform_filter(
selection
).mark_point().encode(
x="PC1:Q",
y="PC2:Q",
color="value:N",
column="column:N",
tooltip=['Name:N']
).add_selection(selection)