移动浏览器 Vega-Lite 规范中的间隔选择
Interval selections in Vega-Lite specifications on mobile browsers
Altair 示例图库包含 a nice example 如何使用区间选择创建两个图,其中一个允许您定义另一个的比例。
import altair as alt
from vega_datasets import data
source = data.sp500.url
brush = alt.selection(type='interval', encodings=['x'])
base = alt.Chart(source).mark_area().encode(
x = 'date:T',
y = 'price:Q'
).properties(
width=600,
height=200
)
upper = base.encode(
alt.X('date:T', scale=alt.Scale(domain=brush))
)
lower = base.properties(
height=60
).add_selection(brush)
upper & lower
如果我使用 vega-embed 将生成的规范嵌入到页面上,我得到的东西在桌面浏览器上运行良好,但在移动浏览器上似乎几乎没有任何作用,在移动浏览器上沿着图形拖动不会创建选择。我可以通过在移动浏览器中单击它来删除预定义的选择,但这并没有多大作用。因此我的问题变成了:
Is there any way to create Vega-Lite specifications, preferably in Altair, with interval selections that are intuitive to use on (any of the prevalent) mobile browsers, ideally by allowing users to create selections by dragging along the graph?
不,从 Vega-Lite v4.4 开始,interactions/selections 无法在移动设备上运行。跟踪添加此功能的错误在这里:https://github.com/vega/vega-lite/issues/4661
Altair 示例图库包含 a nice example 如何使用区间选择创建两个图,其中一个允许您定义另一个的比例。
import altair as alt
from vega_datasets import data
source = data.sp500.url
brush = alt.selection(type='interval', encodings=['x'])
base = alt.Chart(source).mark_area().encode(
x = 'date:T',
y = 'price:Q'
).properties(
width=600,
height=200
)
upper = base.encode(
alt.X('date:T', scale=alt.Scale(domain=brush))
)
lower = base.properties(
height=60
).add_selection(brush)
upper & lower
如果我使用 vega-embed 将生成的规范嵌入到页面上,我得到的东西在桌面浏览器上运行良好,但在移动浏览器上似乎几乎没有任何作用,在移动浏览器上沿着图形拖动不会创建选择。我可以通过在移动浏览器中单击它来删除预定义的选择,但这并没有多大作用。因此我的问题变成了:
Is there any way to create Vega-Lite specifications, preferably in Altair, with interval selections that are intuitive to use on (any of the prevalent) mobile browsers, ideally by allowing users to create selections by dragging along the graph?
不,从 Vega-Lite v4.4 开始,interactions/selections 无法在移动设备上运行。跟踪添加此功能的错误在这里:https://github.com/vega/vega-lite/issues/4661