Altair交互式线条图，单击右侧的图标时，线条会弹出并突出显示

Question

我一直试图在jupyter实验室中使用Altair制作一些互动情节。

我到了这个阶段，结果低于下面的水平。

如您所见，该行突出显示时不会弹出到最前面。如何使其弹出到前面？

随附代码。

import altair as alt
source = df
selection = alt.selection_multi(fields=['class'], on='click')    
color = alt.condition(selection,
                      alt.Color('class:O', legend=None,
                      scale=alt.Scale(scheme='category10')),
                      alt.value('lightgray'))

base = alt.Chart(source).mark_line(point=True, size=10).encode(
    x='x',
    y='y',
    color=color
).properties(
    width=800,
    height=900
).interactive()

legend = alt.Chart(source).mark_point(filled=True, size=200).encode(
    y=alt.Y('class:O'),
    color=color
).add_selection(
selection
)

base | legend

Answer 1

无法根据选择更改线条的z顺序。但是，创建类似效果的一种技巧是使用显示所有数据的静态背景以及在选择内容上过滤的前景。

例如：

background = alt.Chart(source).mark_line(point=True, size=10).encode(
    x='x',
    y='y',
    color=alt.value('lightgray')
).properties(
    width=800,
    height=900
)

foreground = background.encode(
    color=alt.Color('class:O', legend=None,
                    scale=alt.Scale(scheme='category10'))
).transform_filter(
    selection
)


legend = alt.Chart(source).mark_point(filled=True, size=200).encode(
    y=alt.Y('class:O'),
    color=color
).add_selection(
    selection
)

(background + foreground) | legend

Answer 2

您可以将opacity属性添加到基本图表以使选择弹出。将以下行添加到您的mark_line()属性

opacity=alt.condition(selection, alt.value(1), alt.value(0.05))