Skip to content

Instantly share code, notes, and snippets.

@maartenzam
Created November 17, 2021 10:51
Show Gist options
  • Save maartenzam/0dac05d973e7ce5ebbacb94ce574c5d1 to your computer and use it in GitHub Desktop.
Save maartenzam/0dac05d973e7ce5ebbacb94ce574c5d1 to your computer and use it in GitHub Desktop.
labelOpacity expression bug
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"description": "A dual axis chart, created by setting y's scale resolution to `\"independent\"`",
"width": 400, "height": 300,
"data": {
"url": "data/weather.csv"
},
"params": [{"name": "toggleHighlight", "bind": {"input": "checkbox"}}],
"transform": [{"filter": "datum.location == \"Seattle\""}],
"encoding": {
"x": {
"timeUnit": "month",
"field": "date",
"axis": {"format": "%b", "title": null}
}
},
"layer": [
{
"mark": {"opacity": 0.3, "type": "line", "color": "#85C5A6"},
"encoding": {
"y": {
"aggregate": "average",
"field": "temp_max",
"scale": {"domain": [0, 30]},
"title": "Avg. Temperature (°C)",
"axis": {
"titleColor": "#85C5A6",
"titleOpacity": { "expr": "toggleHighlight ? 1 : 0.2" },
"labelOpacity": { "expr": "toggleHighlight ? 1 : 0.2" }
}
},
"opacity": {
"condition": { "param": "toggleHighlight", "value": 1 },
"value": 0.2
}
}
},
{
"mark": {"stroke": "#85A9C5", "type": "line", "interpolate": "monotone"},
"encoding": {
"y": {
"aggregate": "average",
"field": "precipitation",
"title": "Precipitation (inches)",
"axis": {
"titleColor":"#85A9C5",
"titleOpacity": { "expr": "toggleHighlight ? 0.2 : 1" },
"labelOpacity": { "expr": "toggleHighlight ? 0.2 : 1" }}
},
"opacity": {
"condition": { "param": "toggleHighlight", "value": 0.2 },
"value": 1
}
}
}
],
"resolve": {"scale": {"y": "independent"}}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment