Histogram with Full-Height Hover Targets for Tooltip

View this example in the online editor

Vega-Lite JSON Specification

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "data": {"url": "data/movies.json"},
  "layer": [
    {
      "params": [
        {
          "name": "hover",
          "select": {"type": "point", "on": "pointerover", "clear": "pointerout"}
        }
      ],
      "mark": {"type": "bar", "color": "#eee", "tooltip": true},
      "encoding": {
        "x": {"bin": true, "field": "IMDB Rating"},
        "opacity": {
          "condition": {"test": {"param": "hover", "empty": false}, "value": 0.5},
          "value": 0
        },
        "detail": [{"aggregate": "count"}]
      }
    },
    {
      "mark": "bar",
      "encoding": {
        "x": {"bin": true, "field": "IMDB Rating"},
        "y": {"aggregate": "count"}
      }
    }
  ]
}