如何从 Altair 中的选定数据中检索属性?

How to retrieve attributes from selected datum in Altair?

我有一个 Streamlit 仪表板,它让我可以使用 Altair 图交互式地探索 t-SNE 嵌入。我想弄清楚如何访问所选数据的元数据,以便我可以可视化相应的图像。换句话说,给定:

selector = alt.selection_single()
chart = (
    alt.Chart(df)
    .mark_circle()
    .encode(x="tSNE_dim1", y="tSNE_dim2", color="predicted class", tooltip=["image url", "predicted class"])
    .add_selection(selector)
)

...有没有类似于

的东西
selected_metadata = selector.tooltip
update_dashboard_img(img=selected_metadata["image url"], caption=selected_metadata["predicted class"])

我知道 但图片在 S3 上,而且图片太多,不适合情节。

不幸的是,Altair 不提供任何将信息从 javascript 渲染传递回 Python 内核的机制,因此通常无法执行您想要执行的操作。

(编辑:如果您使用他们的平台,streamlit 似乎有一个解决方案,但我不知道有任何普遍适用的解决方案)。

我讨厌不同意 Altair 的创造者,但我能够使用 streamlit-vega-lite package 实现这一点。这通过使用 altair_component():

包装对图表创建函数的调用来实现
    from streamlit_vega_lite import altair_component
    ...

    event_dict = altair_component(altair_chart=create_tsne_chart(tsne_df))
    # note: works with selector = alt.selection_interval(), not selection_single()
    dim1_bounds, dim2_bounds = event_dict.get("dim1"), event_dict.get("dim2")
    if dim1_bounds:
        (dim1_min, dim1_max), (dim2_min, dim2_max) = dim1_bounds, dim2_bounds
        selected_images = tsne_df[
            (tsne_df.dim1 >= dim1_min)
            & (tsne_df.dim1 <= dim1_max)
            & (tsne_df.dim2 >= dim2_min)
            & (tsne_df.dim2 <= dim2_max)
        ]
        st.write("Selected Images")
        st.write(selected_images)

        if len(selected_images) > 0:
            for _index, row in selected_images.iterrows():
                img = get_img(row["image url"])
                st.image(img, caption=f"{row['image url']} {row['predicted class']}", use_column_width=True)

event_dict 仅包含有关 selector 范围的信息。因此,您必须使用这些值来重新选择在交互式图表中选择的数据。

请注意,这个包是一个 POC,有各种限制。请为 streamlit_vega_lite 的作者创建的 Streamlit feature request 点赞。

当 0.13 版本发布时,Panel 也可以监听 Vega 事件。有关详细信息,请参阅 https://github.com/holoviz/panel/pull/2592