Question

我正在尝试复制以下堆叠图表，可以通过与底部图表交互，但与烛台图表（分层图表）进行交互，从而选择顶部图表的域：

（以下示例代码在这里：https://altair-viz.github.io/gallery/interval_selection.html）

我无法将其用于分层图表（https://altair-viz.github.io/gallery/candlestick_chart.html）。是否可以通过这种方式使用分层图表按日期进行擦洗？谢谢。

这是我尝试过的：

import altair as alt
from vega_datasets import data

source = data.ohlc()
brush = alt.selection(type='interval', encodings=['x'])
open_close_color = alt.condition("datum.open <= datum.close", alt.value("green"), alt.value("firebrick"))

base = alt.Chart(source).encode(
    alt.X('date:T', axis=alt.Axis(format='%m/%d', title='Date in 2009')),
    color=open_close_color
).properties(width=600, height=400)

rule = base.mark_rule().encode(
    alt.Y('low:Q', title='Price', scale=alt.Scale(domain=brush, zero=False)),
    alt.Y2('high:Q')
)

bar = base.mark_bar().encode(
    alt.Y('open:Q', scale=alt.Scale(domain=brush, zero=False)),
    alt.Y2('close:Q')
)

candles = rule + bar

lower = base.properties(
    height=60
).add_selection(brush)

candles & lower

Answer 1

这是Vega-Lite规格和通过Vega编辑器的交互式图表：https://vega.github.io/editor/#/gist/2e5d94af2d36ee770b980f648774b865/vega-lite-interactive-candlestick-spec.json

这是使用以下python / altair代码创建的：

import altair as alt
from vega_datasets import data

source = data.ohlc()
open_close_color = alt.condition("datum.open <= datum.close",
                                 alt.value("#06982d"),
                                 alt.value("#ae1325"))
brush = alt.selection(type='interval', encodings=['x'])

base = alt.Chart(source).encode(
    alt.X('date:T',
          axis=alt.Axis(
              format='%m/%d',
              labelAngle=-45,
              title='Date in 2009'
          )
    ),
    color=open_close_color
).properties(
    width=600,
)

rule = base.mark_rule().encode(
    alt.Y(
        'low:Q',
        title='Price',
        scale=alt.Scale(zero=False),
    ),
    alt.Y2('high:Q')
)

bar = base.mark_bar().encode(
    alt.Y('open:Q'),
    alt.Y2('close:Q')
)

lower = alt.layer(rule, bar, height=60).add_selection(brush)

upper = (rule + bar).encode(
    alt.X('date:T', scale=alt.Scale(domain=brush))
)

# (upper & lower)                         # display the charts
print((upper & lower).to_json(indent=2))  # get the vega-lite spec

我在Jupyter设置中的交互性存在一些问题，但是当我将规范复制到Vega Editor中时，它可以工作。可能与Vega-Lite的版本有关（我的设置为4.8.1，Vega编辑器为4.16.7）。

Altair：如何在烛台图（即分层图）上使用间隔选择

1 个答案: