选择 zorder#

此示例展示了如何通过使用条件来改变点在鼠标悬停时的 (z)order,从而将选中的点带到最前面/前景。这可以防止选中的点被未选中的点遮挡。

import altair as alt
from vega_datasets import data


cars = data.cars.url

hover = alt.selection_point(on='pointerover', nearest=True, empty=False)
when_hover = alt.when(hover)

chart = alt.Chart(cars, title='Selection obscured by other points').mark_circle(opacity=1).encode(
    x='Horsepower:Q',
    y='Miles_per_Gallon:Q',
    color=when_hover.then(alt.value("coral")).otherwise(alt.value("lightgray")),
    size=when_hover.then(alt.value(300)).otherwise(alt.value(30))
).add_params(
    hover
)

chart | chart.encode(
    order=when_hover.then(alt.value(1)).otherwise(alt.value(0))
).properties(
    title='Selection brought to front'
)
import altair as alt
from vega_datasets import data


cars = data.cars.url

hover = alt.selection_point(on='pointerover', nearest=True, empty=False)
when_hover = alt.when(hover)

chart = alt.Chart(cars, title='Selection obscured by other points').mark_circle(opacity=1).encode(
    x='Horsepower:Q',
    y='Miles_per_Gallon:Q',
    color=when_hover.then(alt.value("coral")).otherwise(alt.value("lightgray")),
    size=when_hover.then(alt.value(300)).otherwise(alt.value(30))
).add_params(
    hover
)

chart | chart.encode(
    order=when_hover.then(alt.value(1)).otherwise(alt.value(0))
).properties(
    title='Selection brought to front'
)
# No channel encoding options are specified in this chart
# so the code is the same as for the method-based syntax.