I'm using Vega (not vega-lite, since I'm using treemap which isn't supported in vega-lite).
In the example in the link above I've added a tooltip on hover, so you can see what each small box is:
...
{
"type": "rect",
"from": {"data": "leaves"},
"encode": {
...
"hover": {
"tooltip": {"field": "name"}, // What I added
"fill": {"value": "red"}
}
}
},
...
This works great for displaying the name in the tooltip, but I'd like to display multiple fields, which I can't figure out the syntax for. I've tried stuff like:
tooltip: [{"field": "name"}, {"field": "depth"}] // Doesn't work
tooltip: {"field": ["name", "depth"]} // Also doesn't work
A formatted string would also be fine, but I also can't figure out how formatting would work, either:
tooltip: "datum['name'] is depth datum['depth']" // Doesn't work
The Marks -> Rect documentation somewhat unhelpfully defines the type for "tooltip" as "Any" (and I'm not even sure if that documentation applies, since my tooltip is actually within the encode -> hover subobject of the rect.
Is there a way to display multiple tooltip values?
Yes there is! Again this is one of those things that is hard to find any documentation on. But here is an example of how I achieve this.
....
encode: {
enter: {
tooltip: {
signal: "{'Title1': datum.field1,
'Title2': datum.field2,
'Title3': datum.field3}"
}
...
You were so close as well! For some reason you just have to define this as one big signal, and then you can access the current datum.
I understand this is without quotation marks (I use the Kibana editor), so you might have to play around with the syntax a bit.