Altair实现两种选择类型互斥：新选择覆盖旧选择

需求是在Altair散点图中同时支持两种选择方式：鼠标点选单个点、通过下拉框选择ID，但两种选择互斥——每次只有最新操作的选择生效，之前的选择会被清除，仅保留当前选中的点高亮。

修改后的代码实现 #

import pandas as pd
import altair as alt

df = pd.DataFrame({'ID':[1,2,3,4,5], 'age':[20,20,19,16,26], 'IQ':[100,79,50,103,99]})

# 鼠标点选：单次选择，点击时触发清除下拉选择
selection_MOUSE = alt.selection_single(
    fields=['ID'],
    on='click',
    empty='none'
)

# 下拉选择：绑定ID选项，选择时触发清除鼠标点选
dropdownIDs = alt.binding_select(options=[1,2,3,4,5], name="Selector: ")
selection_DROPDOWN = alt.selection_single(
    fields=['ID'],
    bind=dropdownIDs,
    empty='none'
)

chart = alt.Chart(df).mark_point(filled=True).encode(
    x=alt.X('age:Q'),
    y=alt.Y('IQ:Q'),
    opacity=alt.condition(
        selection_DROPDOWN | selection_MOUSE,
        alt.value(1),
        alt.value(.2)
    ),
    tooltip=['ID']
).add_selection(
    selection_MOUSE,
    selection_DROPDOWN
).add_params(
    # 当下拉选择有值时，清空鼠标选择
    alt.param(expr="selection_DROPDOWN.ID ? selection_MOUSE.clear() : null"),
    # 当鼠标选择有值时，清空下拉选择
    alt.param(expr="selection_MOUSE.ID ? selection_DROPDOWN.clear() : null")
).interactive()

chart.display()

关键修改说明 #

• 将鼠标选择从selection_multi改为selection_single，确保每次仅选中一个点，契合互斥需求。
• 通过alt.param的表达式逻辑实现互斥机制：
  • 当下拉框选中某个ID时，自动清除鼠标点选的内容
  • 当鼠标点击选中某个点时，自动清空下拉框的选择
• 保留原有的透明度条件判断，确保当前选中的点保持高亮，其余点变灰。

内容的提问来源于stack exchange，提问作者CKCMathCS613