docs(examples): Bar Chart with Full-Height Hover Targets for Tooltip

vega · Jun 13, 2022 · a7af902 · a7af902
1 parent 9d4164f
commit a7af902
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 0 deletions.
diff --git a/examples/specs/interactive_bar_full_height_hover.vl.json b/examples/specs/interactive_bar_full_height_hover.vl.json
@@ -0,0 +1,30 @@
+{
+  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
+  "data": {"url": "data/movies.json"},
+  "layer": [
+    {
+      "params": [
+        {
+          "name": "hover",
+          "select": {"type": "point", "on": "mouseover", "clear": "mouseout"}
+        }
+      ],
+      "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"}
+      }
+    }
+  ]
+}
diff --git a/site/_data/examples.json b/site/_data/examples.json
@@ -791,6 +791,10 @@
         "name": "interactive_bar_select_highlight",
         "title": "Bar Chart with Highlighting on Hover and Selection on Click"
       },
+      {
+        "name": "interactive_bar_full_height_hover",
+        "title": "Bar Chart with Full-Height Hover Targets for Tooltip"
+      },
       {
         "name": "interactive_legend",
         "title": "Interactive Legend"