【发布时间】:2022-01-02 18:31:25
【问题描述】:
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"repeat": {
"row": ["Horsepower", "Acceleration", "Miles_per_Gallon"],
"column": ["Miles_per_Gallon", "Acceleration", "Horsepower"]
},
"spec": {
"data": {"url": "data/cars.json"},
"mark": "point",
"params": [
{
"name": "brush",
"select": {
"type": "interval",
"resolve": "union",
"on": "[mousedown[event.shiftKey], window:mouseup] > window:mousemove!",
"translate": "[mousedown[event.shiftKey], window:mouseup] > window:mousemove!",
"zoom": "wheel![event.shiftKey]"
}
},
{
"name": "grid",
"select": {
"type": "interval",
"resolve": "global",
"translate": "[mousedown[!event.shiftKey], window:mouseup] > window:mousemove!",
"zoom": "wheel![!event.shiftKey]"
},
"bind": "scales"
}
],
"encoding": {
"x": {"field": {"repeat": "column"}, "type": "quantitative"},
"y": {
"field": {"repeat": "row"},
"type": "quantitative",
"axis": {"minExtent": 30}
},
"color": {
"condition": {
"param": "brush",
"field": "Origin",
"type": "nominal"
},
"value": "grey"
}
}
}
}
目前,我有 3 个独立的散点图,它们都是相同的数据集。经过多次尝试,我仍然无法弄清楚如何将它们放在一起/链接它们。我知道我的要复杂一些,因为我的轴不一样。 我真的一直在为此苦苦挣扎,任何帮助都将不胜感激,因为我需要它。谢谢!
图表 1
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"title": {
"text": "Number of Billionaires and Education Attainment",
"subtitle": "From 2015-2020. Sources: Forbes & World Bank",
"subtitleFontStyle": "italic",
"subtitleFontSize": 10,
"anchor": "start",
"color": "black"
},
"height": 100,
"width": 100,
"data": {
"url": "https://raw.githubusercontent.com/jamieprince/jamieprince.github.io/main/correlation.csv"
},
"transform": [
{"calculate": "datum.Educationalattainment/100", "as": "percent"},
{"filter": {"field": "Educationalattainment", "gt": 0}}
],
"selection": {
"paintbrush": {"type": "multi", "on": "mouseover", "nearest": true},
"grid": {"type": "interval", "bind": "scales"}
},
"mark": {"type": "circle", "opacity": 0.5, "color": "#C96E11"},
"encoding": {
"x": {
"field": "Number of Billionaires",
"type": "quantitative",
"axis": {
"title": "Number of Billionaires",
"grid": false,
"tickCount": 10
}
},
"y": {
"field": "percent",
"type": "quantitative",
"axis": {"title": "Educational Attainment", "grid": false, "format": "%"}
},
"size": {
"condition": {
"selection": "paintbrush",
"value": 300,
"init": {"value": 70}
},
"value": 70
},
"tooltip": [
{"field": "Year", "type": "nominal", "title": "Year"},
{"field": "Country", "type": "ordinal", "title": "Country"},
{
"field": "Number of Billionaires",
"type": "nominal",
"title": "No of Billionaires"
},
{
"field": "Educationalattainment",
"type": "nominal",
"title": "Educational attainment at least completed short-cycle tertiary population 25+ total (%) (cumulative)"
}
]
}
}
图表 2
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"title": {
"text": "GDP per capita and Education Attainment",
"subtitle": "From 2015-2020. Sources: World Bank",
"subtitleFontStyle": "italic",
"subtitleFontSize": 10,
"anchor": "start",
"color": "black"
},
"height": 100,
"width": 100,
"data": {
"url": "https://raw.githubusercontent.com/jamieprince/jamieprince.github.io/main/correlation.csv"
},
"transform": [
{"calculate": "datum.Educationalattainment/100", "as": "percent"},
{"filter": {"field": "Educationalattainment", "gt": 0}}
],
"selection": {
"paintbrush": {"type": "multi", "on": "mouseover", "nearest": true},
"grid": {"type": "interval", "bind": "scales"}
},
"mark": {"type": "circle", "opacity": 0.5, "color": "#EC9D3E"},
"encoding": {
"x": {
"field": "GDP per capita",
"type": "quantitative",
"axis": {
"title": "GDP per capita",
"grid": false,
"tickCount": 10,
"labelOverlap": "greedy"
}
},
"y": {
"field": "percent",
"type": "quantitative",
"axis": {"title": "Educational Attainment", "grid": false, "format": "%"}
},
"size": {
"condition": {
"selection": "paintbrush",
"value": 300,
"init": {"value": 70}
},
"value": 70
},
"tooltip": [
{"field": "Year", "type": "nominal", "title": "Year"},
{"field": "Country", "type": "ordinal", "title": "Country"},
{"field": "GDP per capita", "type": "nominal", "title": "GDP per capita"},
{
"field": "Educationalattainment",
"type": "nominal",
"title": "Educational attainment at least completed short-cycle tertiary population 25+ total (%) (cumulative)"
}
]
}
}
图表 3
{
"$schema": "https://vega.github.io/schema/vega-lite/v4.json",
"title": {
"text": "No of billionaires and GDP per capita",
"subtitle": "From 2015-2020. Sources: Forbes & World Bank",
"subtitleFontStyle": "italic",
"subtitleFontSize": 10,
"anchor": "start",
"color": "black"
},
"height": 100,
"width": 100,
"data": {
"url": "https://raw.githubusercontent.com/jamieprince/jamieprince.github.io/main/correlation.csv"
},
"selection": {
"paintbrush": {"type": "multi", "on": "mouseover", "nearest": true},
"grid": {"type": "interval", "bind": "scales"}
},
"mark": {"type": "circle", "opacity": 0.5, "color": "#FBCA8B"},
"encoding": {
"x": {
"field": "Number of Billionaires",
"type": "quantitative",
"axis": {
"title": "Number of Billionaires",
"grid": false,
"tickCount": 14
}
},
"y": {
"field": "GDP per capita",
"type": "quantitative",
"axis": {"title": "GDP per capita", "grid": false}
},
"size": {
"condition": {
"selection": "paintbrush",
"value": 300,
"init": {"value": 70}
},
"value": 70
},
"tooltip": [
{"field": "Year", "type": "nominal", "title": "Year"},
{"field": "Country", "type": "ordinal", "title": "Country"},
{"field": "GDP per capita", "type": "nominal", "title": "GDP per capita"},
{
"field": "Number of Billionaires",
"type": "nominal",
"title": "Number of Billionaires"
}
]
}
}
【问题讨论】: