I am using independent y-scales on a Vega-Lite visualization. If I add "resolve": { "scale": {"y": "independent"}}
to the spec, the tooltip does not work:
But if I remove the aforementioned line of code it works just fine:
How can I use tooltips with independent y-scales?
Full Vega-Lite spec:
{
"$schema": ".0.json",
"title": "",
"width": "container",
"config": {
"customFormatTypes": true,
"axis": {
"labelFont": "Roboto",
"labelFontSize": 12,
"labelFontWeight": 400,
"labelColor": "0x5f6368"
},
"legend": {
"symbolOpacity": 1,
"orient": "bottom",
"direction": "horizontal",
"columns": 4
}
},
"datasets": {
"dataset_id_1": [
{"value": 12, "date": "2022-01-10T14:00:00.000Z"},
{"value": 22, "date": "2022-02-10T14:00:00.000Z"},
{"value": 66, "date": "2022-03-10T14:00:00.000Z"},
{"value": 33, "date": "2022-04-10T14:00:00.000Z"}
],
"dataset_id_2": [
{"value": 22, "date": "2022-03-10T14:00:00.000Z"},
{"value": 12, "date": "2022-04-10T14:00:00.000Z"},
{"value": 96, "date": "2022-05-10T14:00:00.000Z"},
{"value": 33, "date": "2022-06-10T14:00:00.000Z"}
],
"dataset_id_3": [
{
"value": 12,
"date": "2022-01-10T14:00:00.000Z",
"line": "Holy Handgrenades"
},
{
"value": 22,
"date": "2022-02-10T14:00:00.000Z",
"line": "Holy Handgrenades"
},
{
"value": 66,
"date": "2022-03-10T14:00:00.000Z",
"line": "Holy Handgrenades"
},
{
"value": 33,
"date": "2022-04-10T14:00:00.000Z",
"line": "Holy Handgrenades"
},
{
"value": 22,
"date": "2022-03-10T14:00:00.000Z",
"line": "Vorpol Rabbits"
},
{
"value": 12,
"date": "2022-04-10T14:00:00.000Z",
"line": "Vorpol Rabbits"
},
{
"value": 96,
"date": "2022-05-10T14:00:00.000Z",
"line": "Vorpol Rabbits"
},
{
"value": 33,
"date": "2022-06-10T14:00:00.000Z",
"line": "Vorpol Rabbits"
}
]
},
"layer": [
{
"data": {"name": "dataset_id_2"},
"transform": [{"calculate": "'Vorpal Rabbits'", "as": "c"}],
"mark": {"type": "line", "strokeWidth": 2, "stroke": "red"},
"encoding": {
"y": {
"field": "value",
"type": "quantitative",
"axis": {"title": "Incidents"}
},
"x": {
"timeUnit": "yearmonthdate",
"field": "date",
"title": "",
"axis": {"labelFlush": true, "tickCount": 5}
},
"color": {
"field": "c",
"scale": {"domain": ["Vorpol Rabbits"], "range": ["red"]},
"title": ""
}
}
},
{
"data": {"name": "dataset_id_1"},
"transform": [{"calculate": "'Holy Handgrenades'", "as": "c"}],
"mark": {"type": "line", "strokeWidth": 2},
"encoding": {
"y": {
"field": "value",
"type": "quantitative",
"axis": {"title": "Incidents"}
},
"x": {
"timeUnit": "yearmonthdate",
"field": "date",
"title": "",
"axis": {"labelFlush": true, "tickCount": 5}
},
"stroke": {
"scale": {"range": ["green", "blue"]},
"field": "c",
"legend": {"title": ""}
},
"tooltip": {"field": "tooltip"}
}
},
{
"data": {"name": "dataset_id_3"},
"transform": [{"pivot": "line", "value": "value", "groupby": ["date"]}],
"mark": "rule",
"encoding": {
"x": {"field": "date", "type": "temporal"},
"opacity": {
"condition": {"value": 0.3, "param": "hover", "empty": false},
"value": 0
},
"tooltip": [
{"field": "Holy Handgrenades", "type": "quantitative"},
{"field": "Vorpol Rabbits", "type": "quantitative"}
]
},
"params": [
{
"name": "hover",
"select": {
"type": "point",
"fields": ["date"],
"nearest": true,
"on": "mouseover",
"clear": "mouseout"
}
}
]
}
],
"resolve": { "scale": {"y": "independent"}}
}
Thanks in advance!