Hi, this is my first post regaring a challenge i am facing while recreating a visual from tableau public gallery , I tried to recreate it using vega-lite in Deneb but stuck to the point from where I need expert's assitance.
https://public.tableau.com/views/2024_02_14_WW07_Toggle_Selections/2024_02_14_WW07_Toggle_Selections...
Below is the vega-lite code:
{
"data": {"name": "dataset"},
"hconcat": [
{
"encoding": {
"color": {
"condition": {
"param": "click",
"field": "category",
"scale": {
"domain": [
"Normal",
"Gear",
"Other",
"Book",
"Extended",
"Collection",
"Random"
],
"range": [
"#248EA6", "#F28907", "#F2D338", "#F2622E", "#F23030", "#2D49A5",
"#D96704"
]
}
},
"value": "#6C745C"
},
"x": {"value": 0},
"y": {
"field": "category",
"axis": null
},
"opacity": {
"condition": {
"param": "click",
"value": 1
},
"value": 0.5
},
"stroke": {
"condition": {
"param": "click",
"empty": false,
"value": "black"
},
"value": null
}
},
"width": -80,
"height": 300,
"mark": {
"type": "circle",
"size": 200,
"strokeWidth": 2,
"stroke": "#58788C"
},
"params": [
{
"name": "click",
"select": {
"type": "point",
"encodings": ["color"]
}
}
]
},
{
"layer": [
{
"width": 200,
"height": 300,
"mark": {
"type": "bar",
"strokeWidth": 2,
"yOffset": 5,
"stroke": "#58788C",
"cornerRadiusEnd": 2,
"height": {"band": 0.5}
},
"params": [
{
"name": "click",
"select": {
"type": "point",
"encodings": ["color"]
}
}
],
"encoding": {
"color": {
"condition": {
"param": "click",
"field": "category",
"scale": {
"domain": [
"Normal",
"Gear",
"Other",
"Book",
"Extended",
"Collection",
"Random"
],
"range": [
"#248EA6", "#F28907", "#F2D338", "#F2622E", "#F23030", "#2D49A5",
"#D96704"
]
}
},
"value": "lightgray"
},
"y": {
"field": "category",
"scale": {"padding": 0},
"axis": {
"bandPosition": 0,
"grid": false,
"domain": false,
"ticks": false,
"labelAlign": "left",
"labelBaseline": "middle",
"labelPadding": -5,
"labelOffset": -15,
"titleX": 5,
"titleY": -5,
"titleAngle": 0,
"title": null
}
},
"x": {
"aggregate": "sum",
"field": "# Legos",
"type": "quantitative",
"axis": {
"grid": false,
"title": null
}
},
"stroke": {
"condition": {
"param": "click",
"empty": false,
"value": "black"
},
"value": null
}
}
},
{
"mark": {"type": "text", "dy": -20,"dx":40},
"text": {"expr": "format(datum['category'], '|',datum['# Legos'])"}
}
]
},
{
"params": [
{
"name": "hover",
"select": {
"type": "point",
"fields": ["category"],
"on": "pointerover"
}
},
{
"name": "click",
"select": {
"type": "point",
"encodings": ["color"]
}
}
],
"encoding": {
"color": {
"condition": {
"param": "click",
"field": "category",
"type": "nominal",
"legend": null
},
"value": "grey"
},
"opacity": {
"condition": {
"param": "hover",
"value": 1
},
"value": 0.2
},
"x": {
"field": "year",
"axis": {"labelAngle": 0},
"title": "Releasing Years Of Lego Set"
},
"y": {
"aggregate": {"argmax": "year"},
"title": "Legos",
"field": "# Legos",
"type": "quantitative"
}
},
"width": 500,
"height": 300,
"mark": {
"type": "line",
"strokeWidth": 3
}
}
]
}
@giammariam Please let me know if anything else needed to understand the issue.
link to the PBI file.
https://app.powerbi.com/links/My3UX1To48?ctid=fec6573e-be98-46f9-8f1e-33536abc62d1&pbi_source=linkSh...
