Vega lite tooltip when hovering stacked bar text marks

Question

With text marks on stacked bar charts, is there a way to avoid duplicating the tooltip code so that the tool tip is the same when hovering over the text marks?

Example adjusted from here. Note the custom tooltip which shows only gender. If I don't repeat this code for the text mark, it shows a different tooltip when hovering. This gets inelegant with a complex tooltip.

Hovering over a bar:

Hovering over the text:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": { "url": "data/population.json"},
  "transform": [
    {"filter": "datum.year == 2000"},
    {"calculate": "datum.sex == 2 ? 'Female' : 'Male'", "as": "gender"}
  ],
  "height": {"step": 17},
  "encoding": {
    "y": {"field": "age"}
  },
  "layer": [{
    "mark": {"type": "bar", "tooltip": true},
    "encoding": {
      "x": {
        "aggregate": "sum", "field": "people",
        "title": "population",
        "stack":  "normalize"
      },
      "color": {
        "field": "gender",
        "scale": {"range": ["#675193", "#ca8861"]}
      },
      "tooltip": [
        {   
          "field": "gender",
          "type": "nominal",
          "title": "Gender"}
      ]
    }
  }, {
    "mark": {"type": "text", "opacity": 0.9, "color": "white", "tooltip": true},
    "encoding": {
      "x": {
        "aggregate": "sum", "field": "people",
        "title": "population",
        "stack":  "normalize",
        "bandPosition": 0.5
      },
      "text": {
        "aggregate": "sum", "field": "people",
        "title": "population"
      },
      "detail": {
        "field": "gender"
      }
    }
  }]
}

More generally, it would be good to find some guidance where code needs to be repeated and where it can be defined once and reused.

Answer 1

Just elevate the encoding for the custom tooltip then it will be reused across marks. I don't think VL has an attribute for "interactive" which is what is used in Vega.

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {"url": "data/population.json"},
  "transform": [
    {"filter": "datum.year == 2000"},
    {"calculate": "datum.sex == 2 ? 'Female' : 'Male'", "as": "gender"}
  ],
  "height": {"step": 17},
  "encoding": {
    "tooltip": [{"field": "gender", "type": "nominal", "title": "Gender"}],
    "y": {"field": "age"}
  },
  "layer": [
    {
      "mark": {"type": "bar", "tooltip": true},
      "encoding": {
        "x": {
          "aggregate": "sum",
          "field": "people",
          "title": "population",
          "stack": "normalize"
        },
        "color": {"field": "gender", "scale": {"range": ["#675193", "#ca8861"]}}
      }
    },
    {
      "mark": {
        "type": "text",
        "opacity": 0.9,
        "color": "white",
        "tooltip": true
      },
      "encoding": {
        "x": {
          "aggregate": "sum",
          "field": "people",
          "title": "population",
          "stack": "normalize",
          "bandPosition": 0.5
        },
        "text": {"aggregate": "sum", "field": "people", "title": "population"},
        "detail": {"field": "gender"}
      }
    }
  ]
}