Legend Selection doesn't work on composite charts

[ztawilvdl]

Describe the bug

When creating a composite Altair chart, the legend selection won't work.

Will you submit a PR?

• Yes

Environment

{
  "marimo": "0.16.5",
  "editable": false,
  "location": "/Users/zeintawil/.pyenv/versions/3.10.13/envs/vdl-env/lib/python3.10/site-packages/marimo",
  "OS": "Darwin",
  "OS Version": "24.5.0",
  "Processor": "arm",
  "Python Version": "3.10.13",
  "Locale": "en_US",
  "Binaries": {
    "Browser": "140.0.7339.215",
    "Node": "v22.3.0"
  },
  "Dependencies": {
    "click": "8.1.8",
    "docutils": "0.22",
    "itsdangerous": "2.2.0",
    "jedi": "0.19.2",
    "markdown": "3.7",
    "narwhals": "2.6.0",
    "packaging": "24.2",
    "psutil": "7.0.0",
    "pygments": "2.19.1",
    "pymdown-extensions": "10.16.1",
    "pyyaml": "6.0.2",
    "starlette": "0.46.1",
    "tomlkit": "0.13.2",
    "typing-extensions": "4.12.2",
    "uvicorn": "0.34.0",
    "websockets": "15.0.1"
  },
  "Optional Dependencies": {
    "altair": "5.5.0",
    "duckdb": "1.2.2",
    "openai": "1.68.2",
    "pandas": "1.5.3",
    "pyarrow": "19.0.1",
    "ruff": "0.11.5"
  },
  "Experimental Flags": {}
}

Code to reproduce

sample_data = [
    [2, 1, 4, 10, 'a',],
    [3, 0, 6, 12, 'b',],
    [8, 5, 12, 15, 'c'],
]
sample_df = pd.DataFrame(sample_data, columns=['value', 'lower', 'upper', 'x_value', 'category'])

sample_color = alt.Color(
    field="category",
    type="nominal",
    legend=alt.Legend(
        title='category',
        labelLimit=0,
        symbolLimit=0,
    ),
)


sample_base_chart = alt.Chart(sample_df, title="Sample Error Bars")

sample_rule = sample_base_chart.mark_rule().encode(
    x=alt.X('x_value'),
    y=alt.Y('upper'),
    y2='lower',
    color=sample_color,
)

sample_upper_tick = sample_base_chart.mark_tick(orient='horizontal', size=5).encode(
    x='x_value:Q',
    y='upper:Q',
    color=sample_color,
)
sample_tick = sample_upper_tick.encode(y='lower:Q')

sample_lines = sample_rule + sample_upper_tick + sample_tick

sample_dots = sample_base_chart.mark_point(
    filled=True, size=60
).encode(
    x=alt.X('x_value'),
    y=alt.Y('value'),
    color=sample_color,
)

alt_chart = sample_dots + sample_lines

sample_mo_chart = mo.ui.altair_chart(alt_chart)

sample_mo_chart

[ztawilvdl]

FWIW, I was able to get it to work they way I wanted but had to define the opacity and legend selection explicitely

Notice I had to set chart_selection=None and legend_selection=sample_legend_selection.

And with that chart_selection=None I lost the brush and click, so set those up as well.

sample_data = [
    [2, 1, 4, 10, 'a',],
    [3, 0, 6, 12, 'b',],
    [8, 5, 12, 15, 'c'],
    [10, 9, 13, 11, 'c'],
]
sample_df = pd.DataFrame(sample_data, columns=['value', 'lower', 'upper', 'x_value', 'category'])

sample_legend_selection = alt.selection_point(
    fields=["category"],
    bind="legend",
    name="legend_selection",  # keep a stable, known signal name
)

sample_interval_selection = alt.selection_interval()
sample_point_selection = alt.selection_point()

sample_color = alt.Color(
    field="category",
    type="nominal",
    legend=alt.Legend(
        title='category',
        labelLimit=0,
        symbolLimit=0,
    ),
)

sample_opacity = alt.condition(
    sample_legend_selection & sample_interval_selection & sample_point_selection, alt.value(0.9), alt.value(0.1)
)

sample_base_chart = alt.Chart(sample_df, title="Sample Error Bars")

sample_rule = sample_base_chart.mark_rule().encode(
    x=alt.X('x_value'),
    y=alt.Y('upper'),
    y2='lower',
    color=sample_color,
    opacity=sample_opacity
)

sample_upper_tick = sample_base_chart.mark_tick(orient='horizontal', size=5).encode(
    x='x_value:Q',
    y='upper:Q',
    color=sample_color,
    opacity=sample_opacity
)
sample_tick = sample_upper_tick.encode(y='lower:Q')

sample_lines = sample_rule + sample_upper_tick + sample_tick

sample_dots = sample_base_chart.mark_point(
    filled=True, size=60
).encode(
    x=alt.X('x_value'),
    y=alt.Y('value'),
    color=sample_color,
    opacity=sample_opacity,
)

sample_alt_chart = (sample_dots + sample_lines).add_params(sample_legend_selection, sample_point_selection, sample_interval_selection)

sample_mo_chart = mo.ui.altair_chart(sample_alt_chart, legend_selection=sample_legend_selection, chart_selection=None)

sample_mo_chart

[mscolnick]

mo.ui.altair_chart is mainly only intended for simple charts. We attempt to automatically add selection, but it becomes difficult to do so with multiple layers.

However, this does seem like a case we can support/solve for, but it may be a bit of time before we can prioritize this.

[ztawilvdl]

@mscolnick that makes sense. Having just browsed at the code I wonder if a simplish solution would be to allow passing in the chart_selections as a list? In the same way you can pass in the legend_selection?

And/or just having an example in the docs would be big for explaining to folks how to get around this since it's still possible. I can't tell you how many unlocks there have been for my team and our clients with being able to do some simple (and not so simple) charts that allow for these selections and table that filters underneath. It's really really helpful and has Marimo-pilled a lot of folks (relative to my work network).

[mscolnick]

@ztawilvdl - that might be simple to pass the list. definitely providing the example is value (either here or in the docs). if you are interested in taking a stab at it, we'd definitely appreciate the help. otherwise, we can look to prioritize soon

[ztawilvdl]

I'll look into contributing to the docs (at least)--maybe can try a stab at the actual implementation. Thank you guys. Love the work!

…

On Fri, Oct 10, 2025 at 11:57 AM Myles Scolnick ***@***.***> wrote: *mscolnick* left a comment (marimo-team/marimo#6676) <#6676 (comment)> @ztawilvdl <https://github.com/ztawilvdl> - that might be simple to pass the list. definitely providing the example is value (either here or in the docs). if you are interested in taking a stab at it, we'd definitely appreciate the help. otherwise, we can look to prioritize soon — Reply to this email directly, view it on GitHub <#6676 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BDAVUQ6MFPADZFRDHI7SMK33W76Q7AVCNFSM6AAAAACIH5CM36VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTGOJRHA3DGOJZGM> . You are receiving this because you were mentioned.Message ID: ***@***.***>

[mscolnick]

@ztawilvdl i have a fix out for this in #6971