根据另一个图表中动态更新的轴顺序对图表轴进行排序
Sorting a chart axis based on the dynamically updated axis order in another chart
在 this VegaLite spec 中,最底部的条形图的 y 轴顺序随着该图的数据根据散点图中的选择进行过滤而更新。在我将同一个条形图与另一个图表分层的情况下,如何为最顶部条形图中的蓝色和橙色条实现相同的求助行为?
我试过在共享轴和独立轴之间切换轴并切换层的顺序,但没有成功。从概念上讲,我可以想象使用计算转换来定义一个基于选择并用作排序顺序键的新字段,但我不知道如何编写这个 vega 表达式字符串。
这里是 Altair 代码,如果有人喜欢这样解决的话:
import altair as alt
import pandas as pd
data={
'Term': ['algorithm','learning','learning','algorithm','algorithm','learning'],
'Freq_x': [1330,1153,504.42,296.69,177.59,140.35],
'Total': [1330, 1353,1353.7,1330.47,1330.47,1353.7],
'Category': ['Default', 'Default', 'Topic1', 'Topic1', 'Topic2', 'Topic2'],
'logprob': [30.0, 27.0, -5.116, -5.1418, -5.4112, -5.5271],
'loglift': [30.0, 27.0, 0.0975, 0.0891, -0.1803, -0.3135],
'saliency_ind': [0, 3, 76, 77, 181, 186],
'x': [None,None,-0.0080,-0.0080,-0.0053,-0.0053],
'y': [None,None,-0.0056,-0.0056, 0.0003,0.0003],
'topics': [None,None, 1.0, 1.0, 2.0, 2.0],
'cluster': [None,None, 1.0, 1.0, 1.0, 1.0],
'Freq_y': [None,None,20.39,20.39,14.18,14.18]}
df=pd.DataFrame(data)
pts = alt.selection(type="single", fields=['Category'], empty='none')
points = alt.Chart(df).mark_circle().encode(
x='mean(x)',
y='mean(y)',
size='Freq_y',
detail='Category',
color=alt.condition(pts, alt.value('#F28E2B'), alt.value('#4E79A7'))
).add_selection(pts)
bars = alt.Chart(df).mark_bar().encode(
x='Freq_x',
y=alt.Y('Term'),
)
bars2 = alt.Chart(df).mark_bar(color='#F28E2B').encode(
x='Freq_x',
y=alt.Y('Term', sort='-x'),
).transform_filter(
pts
)
(points | (bars + bars2) & bars2)
您的规范存在的问题是,在 layers
中,您执行了 filter
转换,这为每个层创建了一个单独的 data
。排序在图层的每个级别上都有效,但由于两个图层 data
都是分开的,因此每个图层都是独立排序的。
因此,我没有进行过滤器转换,而是尝试使用 calculate
转换手动过滤并创建了一个 filtered_freq_x
字段,稍后在第二层使用该字段并在 [=24] 上使用它执行排序=].因此,我的数据对于两个层都变得相同,只添加和使用了几个字段。
如果这对您不起作用,请告诉我。下面是规格配置和 editor:
{
"config": {"view": {"continuousWidth": 200, "continuousHeight": 300}},
"hconcat": [
{
"mark": "circle",
"encoding": {
"color": {
"condition": {"value": "#F28E2B", "selection": "selector046"},
"value": "#4E79A7"
},
"detail": {"type": "nominal", "field": "Category"},
"size": {"type": "quantitative", "field": "Freq_y"},
"x": {"type": "quantitative", "aggregate": "mean", "field": "x"},
"y": {"type": "quantitative", "aggregate": "mean", "field": "y"}
},
"selection": {
"selector046": {
"type": "single",
"fields": ["Category"],
"empty": "none"
}
}
},
{
"vconcat": [
{
"transform": [
{
"joinaggregate": [
{"field": "Freq_x", "op": "max", "as": "max_Fx"}
]
},
{
"calculate": "selector046['Category'] ? selector046['Category'] : []",
"as": "filterCategory"
},
{
"calculate": "indexof(datum.filterCategory,datum['Category']) > -1 ? datum['Freq_x'] : null",
"as": "filtered_Freq_x"
},
{
"sort": [{"field": "filtered_Freq_x", "order": "descending"}],
"window": [{"op": "rank", "as": "Sorted"}]
}
],
"height": 50,
"layer": [
{
"mark": "bar",
"encoding": {
"x": {"type": "quantitative", "field": "Freq_x"},
"y": {
"type": "nominal",
"field": "Term",
"sort": {"field": "Sorted"}
}
}
},
{
"mark": {"type": "bar", "color": "#F28E2B"},
"encoding": {
"x": {"type": "quantitative", "field": "filtered_Freq_x"},
"y": {
"type": "nominal",
"field": "Term",
"sort": {"field": "Sorted"}
}
}
}
]
},
{
"mark": {"type": "bar", "color": "#F28E2B"},
"encoding": {
"x": {"type": "quantitative", "field": "Freq_x"},
"y": {"type": "nominal", "field": "Term", "sort": "-x"}
},
"transform": [{"filter": {"selection": "selector046"}}]
}
]
}
],
"data": {"name": "data-d807cd22b94d04d6f1543201cfe5f45e"},
"$schema": "https://vega.github.io/schema/vega-lite/v4.8.1.json",
"datasets": {
"data-d807cd22b94d04d6f1543201cfe5f45e": [
{
"Term": "algorithm",
"Freq_x": 1330,
"Total": 1330,
"Category": "Default",
"logprob": 30,
"loglift": 30,
"saliency_ind": 0,
"x": null,
"y": null,
"topics": null,
"cluster": null,
"Freq_y": null
},
{
"Term": "learning",
"Freq_x": 1153,
"Total": 1353,
"Category": "Default",
"logprob": 27,
"loglift": 27,
"saliency_ind": 3,
"x": null,
"y": null,
"topics": null,
"cluster": null,
"Freq_y": null
},
{
"Term": "learning",
"Freq_x": 504.42,
"Total": 1353.7,
"Category": "Topic1",
"logprob": -5.116,
"loglift": 0.0975,
"saliency_ind": 76,
"x": -0.008,
"y": -0.0056,
"topics": 1,
"cluster": 1,
"Freq_y": 20.39
},
{
"Term": "algorithm",
"Freq_x": 296.69,
"Total": 1330.47,
"Category": "Topic1",
"logprob": -5.1418,
"loglift": 0.0891,
"saliency_ind": 77,
"x": -0.008,
"y": -0.0056,
"topics": 1,
"cluster": 1,
"Freq_y": 20.39
},
{
"Term": "algorithm",
"Freq_x": 177.59,
"Total": 1330.47,
"Category": "Topic2",
"logprob": -5.4112,
"loglift": -0.1803,
"saliency_ind": 181,
"x": -0.0053,
"y": 0.0003,
"topics": 2,
"cluster": 1,
"Freq_y": 14.18
},
{
"Term": "learning",
"Freq_x": 140.35,
"Total": 1353.7,
"Category": "Topic2",
"logprob": -5.5271,
"loglift": -0.3135,
"saliency_ind": 186,
"x": -0.0053,
"y": 0.0003,
"topics": 2,
"cluster": 1,
"Freq_y": 14.18
}
]
}
}
在 this VegaLite spec 中,最底部的条形图的 y 轴顺序随着该图的数据根据散点图中的选择进行过滤而更新。在我将同一个条形图与另一个图表分层的情况下,如何为最顶部条形图中的蓝色和橙色条实现相同的求助行为?
我试过在共享轴和独立轴之间切换轴并切换层的顺序,但没有成功。从概念上讲,我可以想象使用计算转换来定义一个基于选择并用作排序顺序键的新字段,但我不知道如何编写这个 vega 表达式字符串。
这里是 Altair 代码,如果有人喜欢这样解决的话:
import altair as alt
import pandas as pd
data={
'Term': ['algorithm','learning','learning','algorithm','algorithm','learning'],
'Freq_x': [1330,1153,504.42,296.69,177.59,140.35],
'Total': [1330, 1353,1353.7,1330.47,1330.47,1353.7],
'Category': ['Default', 'Default', 'Topic1', 'Topic1', 'Topic2', 'Topic2'],
'logprob': [30.0, 27.0, -5.116, -5.1418, -5.4112, -5.5271],
'loglift': [30.0, 27.0, 0.0975, 0.0891, -0.1803, -0.3135],
'saliency_ind': [0, 3, 76, 77, 181, 186],
'x': [None,None,-0.0080,-0.0080,-0.0053,-0.0053],
'y': [None,None,-0.0056,-0.0056, 0.0003,0.0003],
'topics': [None,None, 1.0, 1.0, 2.0, 2.0],
'cluster': [None,None, 1.0, 1.0, 1.0, 1.0],
'Freq_y': [None,None,20.39,20.39,14.18,14.18]}
df=pd.DataFrame(data)
pts = alt.selection(type="single", fields=['Category'], empty='none')
points = alt.Chart(df).mark_circle().encode(
x='mean(x)',
y='mean(y)',
size='Freq_y',
detail='Category',
color=alt.condition(pts, alt.value('#F28E2B'), alt.value('#4E79A7'))
).add_selection(pts)
bars = alt.Chart(df).mark_bar().encode(
x='Freq_x',
y=alt.Y('Term'),
)
bars2 = alt.Chart(df).mark_bar(color='#F28E2B').encode(
x='Freq_x',
y=alt.Y('Term', sort='-x'),
).transform_filter(
pts
)
(points | (bars + bars2) & bars2)
您的规范存在的问题是,在 layers
中,您执行了 filter
转换,这为每个层创建了一个单独的 data
。排序在图层的每个级别上都有效,但由于两个图层 data
都是分开的,因此每个图层都是独立排序的。
因此,我没有进行过滤器转换,而是尝试使用 calculate
转换手动过滤并创建了一个 filtered_freq_x
字段,稍后在第二层使用该字段并在 [=24] 上使用它执行排序=].因此,我的数据对于两个层都变得相同,只添加和使用了几个字段。
如果这对您不起作用,请告诉我。下面是规格配置和 editor:
{
"config": {"view": {"continuousWidth": 200, "continuousHeight": 300}},
"hconcat": [
{
"mark": "circle",
"encoding": {
"color": {
"condition": {"value": "#F28E2B", "selection": "selector046"},
"value": "#4E79A7"
},
"detail": {"type": "nominal", "field": "Category"},
"size": {"type": "quantitative", "field": "Freq_y"},
"x": {"type": "quantitative", "aggregate": "mean", "field": "x"},
"y": {"type": "quantitative", "aggregate": "mean", "field": "y"}
},
"selection": {
"selector046": {
"type": "single",
"fields": ["Category"],
"empty": "none"
}
}
},
{
"vconcat": [
{
"transform": [
{
"joinaggregate": [
{"field": "Freq_x", "op": "max", "as": "max_Fx"}
]
},
{
"calculate": "selector046['Category'] ? selector046['Category'] : []",
"as": "filterCategory"
},
{
"calculate": "indexof(datum.filterCategory,datum['Category']) > -1 ? datum['Freq_x'] : null",
"as": "filtered_Freq_x"
},
{
"sort": [{"field": "filtered_Freq_x", "order": "descending"}],
"window": [{"op": "rank", "as": "Sorted"}]
}
],
"height": 50,
"layer": [
{
"mark": "bar",
"encoding": {
"x": {"type": "quantitative", "field": "Freq_x"},
"y": {
"type": "nominal",
"field": "Term",
"sort": {"field": "Sorted"}
}
}
},
{
"mark": {"type": "bar", "color": "#F28E2B"},
"encoding": {
"x": {"type": "quantitative", "field": "filtered_Freq_x"},
"y": {
"type": "nominal",
"field": "Term",
"sort": {"field": "Sorted"}
}
}
}
]
},
{
"mark": {"type": "bar", "color": "#F28E2B"},
"encoding": {
"x": {"type": "quantitative", "field": "Freq_x"},
"y": {"type": "nominal", "field": "Term", "sort": "-x"}
},
"transform": [{"filter": {"selection": "selector046"}}]
}
]
}
],
"data": {"name": "data-d807cd22b94d04d6f1543201cfe5f45e"},
"$schema": "https://vega.github.io/schema/vega-lite/v4.8.1.json",
"datasets": {
"data-d807cd22b94d04d6f1543201cfe5f45e": [
{
"Term": "algorithm",
"Freq_x": 1330,
"Total": 1330,
"Category": "Default",
"logprob": 30,
"loglift": 30,
"saliency_ind": 0,
"x": null,
"y": null,
"topics": null,
"cluster": null,
"Freq_y": null
},
{
"Term": "learning",
"Freq_x": 1153,
"Total": 1353,
"Category": "Default",
"logprob": 27,
"loglift": 27,
"saliency_ind": 3,
"x": null,
"y": null,
"topics": null,
"cluster": null,
"Freq_y": null
},
{
"Term": "learning",
"Freq_x": 504.42,
"Total": 1353.7,
"Category": "Topic1",
"logprob": -5.116,
"loglift": 0.0975,
"saliency_ind": 76,
"x": -0.008,
"y": -0.0056,
"topics": 1,
"cluster": 1,
"Freq_y": 20.39
},
{
"Term": "algorithm",
"Freq_x": 296.69,
"Total": 1330.47,
"Category": "Topic1",
"logprob": -5.1418,
"loglift": 0.0891,
"saliency_ind": 77,
"x": -0.008,
"y": -0.0056,
"topics": 1,
"cluster": 1,
"Freq_y": 20.39
},
{
"Term": "algorithm",
"Freq_x": 177.59,
"Total": 1330.47,
"Category": "Topic2",
"logprob": -5.4112,
"loglift": -0.1803,
"saliency_ind": 181,
"x": -0.0053,
"y": 0.0003,
"topics": 2,
"cluster": 1,
"Freq_y": 14.18
},
{
"Term": "learning",
"Freq_x": 140.35,
"Total": 1353.7,
"Category": "Topic2",
"logprob": -5.5271,
"loglift": -0.3135,
"saliency_ind": 186,
"x": -0.0053,
"y": 0.0003,
"topics": 2,
"cluster": 1,
"Freq_y": 14.18
}
]
}
}