Tooltips for selected mark are not evaluated

[marcprux]

This comes from the "Interactive Average" sample with tooltips enabled in the config:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.11.0.json",
  "data": {"url": "data/seattle-weather.csv"},
  "config": {
    "mark": { 
      "tooltip": { "content": "encoding" }
    }
  },
  "layer": [{
    "selection": {
      "brush": {
        "type": "interval",
        "encodings": ["x"]
      }
    },
    "mark": "bar",
    "encoding": {
      "x": {
        "timeUnit": "month",
        "field": "date",
        "type": "ordinal"
      },
      "y": {
        "aggregate": "mean",
        "field": "precipitation",
        "type": "quantitative"
      },
      "opacity": {
        "condition": {
          "selection": "brush", "value": 1
        },
        "value": 0.7
      }
    }
  }, {
    "transform": [{
      "filter": {"selection": "brush"}
    }],
    "mark": "rule",
    "encoding": {
      "y": {
        "aggregate": "mean",
        "field": "precipitation",
        "type": "quantitative"
      },
      "color": {"value": "firebrick"},
      "size": {"value": 3}
    }
  }]
}

The tooltips over unselected marks show the correct values for the tooltip field, but any selected marks will show the unprocessed value of the tooltip config setting, regardless of the value (e.g., true, false, { "content": "data" }).

If, instead, tooltip is specified in the mark def rather than in the config, then the tooltip isn't shown at all for any marks that are selected (but they are still displayed properly for unselected marks). I.e.:

    "mark": {
      "type": "bar",
      "tooltip": { "content": "encoding" }
    }

FTR, I've noticed this behavior with vegaEmbed when passing "tooltip": true in the options.config parameter (in other to enable default tooltips), but I don't know if that is a bug with vega-embed, vega-lite, or vega.

[marcprux]

Interestingly, the behavior seem to be different for point marks than bars. When the "Rectangular Brush" demo had tooltips enabled, the selected items don't display any tooltip at all, but the unselected ones show the tooltips as expected.

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.11.0.json",
  "description": "Drag out a rectangular brush to highlight points.",
  "data": {"url": "data/cars.json"},
  "selection": {
    "brush": {
      "type": "interval",
      "init": {"x": [55, 160], "y": [13, 37]}
    }
  },
  "mark": {
    "type": "point",
    "tooltip": { "content": "data" }
  },
  "encoding": {
    "x": {"field": "Horsepower", "type": "quantitative"},
    "y": {"field": "Miles_per_Gallon", "type": "quantitative"},
    "color": {
      "condition": {"selection": "brush", "field": "Cylinders", "type": "ordinal"},
      "value": "grey"
    }
  }
}

[marcprux]

It looks like the selection state of the mark isn't what prevents the tooltip from displaying, but rather whether the mouse is inside the brushed selection area or not.

In this case the mouse cursor (not visible in the screenshot) is inside the brush rectangle, and the tooltip doesn't work:

But in this case the mouse cursor is over the selected mark, but outside the brush rectangle:

So it appears that it is the selection indicator that is messing up the tooltip, rather than the selection state of the mark itself.

[marcprux]

It turns out that this is simply the behavior of a mark that has empty data. E.g., this mark will show the literal "content: encoding" as the tooltip:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.11.0.json",
  "data": {"values": [{}]},
  "mark": "rect",
  "config": {
    "mark": { 
      "tooltip": { "content": "encoding" }
    }
  }
}

So the problem is probably just that the brush selection area is itself a mark with empty data.

I think the best solution would be to just ignore the tooltip directive for marks with no associated data, thus letting the child mark tooltip handler take over.

[kanitw]

For now I'll drop "tooltip": {"content": "encoding" } in the output (#6442)

To ignore the tooltip directive for marks with no associated data, we need to add such support in Vega first, so I'll move this issue to Vega.

[jheer]

@kanitw Can you please describe in greater detail what you are suggesting Vega should do? Thanks!

[jheer]

I took a closer look. The tooltip tissue here is that indeed the brush is realized as its own mark that is drawn on top of the data-representative marks. Interactive events such as mouseover are "consumed" by the brush and never triggered for underlying bars/points. I don't think there is much we can do about this, as the brush foreground needs to be interactive to receive events for resizing and repositioning.

That said, the mark-level interactive property does support signals, so libraries like VL that generate Vega specs could in theory modulate the interactive state of the brush (and thus allow tooltip events to pass through) if they have a reasonable mechanism for knowing when to do so!

As for the tooltip trigger on the brush, I believe VL should simply refrain from adding tooltip encodings to "meta-marks" such as brushes.

[marcprux]

Can you transfer this issue back to the vega-lite repo so we can continue to track it there?

[jheer]

Re-opening and transferring to Vega-Lite per @marcprux's request.

[willium]

That said, the mark-level interactive property does support signals, so libraries like VL that generate Vega specs could in theory modulate the interactive state of the brush (and thus allow tooltip events to pass through) if they have a reasonable mechanism for knowing when to do so!

Though a bit niche, one possible "mechanism":
In the cases where a user defines an event stream (using the selection's on property) for an interval selection if they require a modifier key to be simultaneously pressed with the mousemove event, we could then reasonably make the brush non-interactive while that modifier is pressed.

[hk7math]

Dear all, I think I am facing the same scenario and need some help..
Before, tooltips was shown automatically on my bars.
After implementing the touch selection #4208 (comment) , the tooltips are gone on mobile

I have been reading through the docs, issues and SO. This seems to be the most relevant discussion, but I need some more guidance on how to work around.. below are some ways I attempted but failed (maybe due to lack of understanding):

• Split the selection to 2 (mouse-event selection for desktop works fine, but touch-event selection for mobile leads to missing tooltips)
• Set consume property of touch selection to false (assuming the event will be passed back to the bars, but it's not the case)
• Look for how to call tooltip programmatically but I couldn't figure it out

This is the trimmed chart
Thank you for your time!

[hk7math]

After implementing the touch selection #4208 (comment) , the tooltips are gone on mobile

It turns out the hidden tooltips can be manually turned on simply by setting this in config

"events": {
  "defaults": {
    "allow": true
  }
}