chore: update examples [CI]

examples/compiled/animated_hop.vg.json

@@ -0,0 +1,157 @@
+{
+  "$schema": "https://vega.github.io/schema/vega/v5.json",
+  "background": "white",
+  "padding": 5,
+  "width": 20,
+  "height": 200,
+  "style": "cell",
+  "data": [
+    {"name": "animation_frame_store"},
+    {
+      "name": "source_0",
+      "url": "data/seattle-weather.csv",
+      "format": {"type": "csv"},
+      "transform": [
+        {
+          "type": "filter",
+          "expr": "isValid(datum[\"precipitation\"]) && isFinite(+datum[\"precipitation\"])"
+        }
+      ]
+    },
+    {
+      "name": "source_0_curr",
+      "source": "source_0",
+      "transform": [
+        {
+          "type": "filter",
+          "expr": "!length(data(\"animation_frame_store\")) || vlSelectionTest(\"animation_frame_store\", datum)"
+        }
+      ]
+    }
+  ],
+  "signals": [
+    {
+      "name": "unit",
+      "value": {},
+      "on": [
+        {"events": "pointermove", "update": "isTuple(group()) ? group() : unit"}
+      ]
+    },
+    {
+      "name": "animation_frame",
+      "update": "vlSelectionResolve(\"animation_frame_store\", \"union\", true, true)"
+    },
+    {
+      "name": "anim_clock",
+      "init": "0",
+      "on": [
+        {
+          "events": {"type": "timer", "throttle": 16.666666666666668},
+          "update": "is_playing ? (anim_clock + (now() - last_tick_at) > max_range_extent ? 0 : anim_clock + (now() - last_tick_at)) : anim_clock"
+        }
+      ]
+    },
+    {
+      "name": "last_tick_at",
+      "init": "now()",
+      "on": [
+        {
+          "events": [{"signal": "anim_clock"}, {"signal": "is_playing"}],
+          "update": "now()"
+        }
+      ]
+    },
+    {"name": "is_playing", "init": "true"},
+    {"name": "eased_anim_clock", "update": "anim_clock"},
+    {"name": "animation_frame_domain", "init": "domain('time')"},
+    {"name": "min_extent", "init": "extent(animation_frame_domain)[0]"},
+    {"name": "max_range_extent", "init": "extent(range('time'))[1]"},
+    {"name": "anim_value", "update": "invert('time', eased_anim_clock)"},
+    {
+      "name": "animation_frame_tuple",
+      "on": [
+        {
+          "events": [{"signal": "eased_anim_clock"}, {"signal": "anim_value"}],
+          "update": "{unit: \"\", fields: animation_frame_tuple_fields, values: [anim_value ? anim_value : min_extent]}",
+          "force": true
+        }
+      ]
+    },
+    {
+      "name": "animation_frame_tuple_fields",
+      "value": [{"type": "E", "field": "date"}]
+    },
+    {
+      "name": "animation_frame_modify",
+      "on": [
+        {
+          "events": {"signal": "animation_frame_tuple"},
+          "update": "modify(\"animation_frame_store\", animation_frame_tuple, true)"
+        }
+      ]
+    }
+  ],
+  "marks": [
+    {
+      "name": "marks",
+      "type": "rect",
+      "style": ["tick"],
+      "interactive": true,
+      "from": {"data": "source_0_curr"},
+      "encode": {
+        "update": {
+          "opacity": {"value": 0.7},
+          "fill": {"value": "#4c78a8"},
+          "ariaRoleDescription": {"value": "tick"},
+          "description": {
+            "signal": "\"precipitation: \" + (format(datum[\"precipitation\"], \"\")) + \"; date: \" + (isValid(datum[\"date\"]) ? datum[\"date\"] : \"\"+datum[\"date\"])"
+          },
+          "xc": {"signal": "width", "mult": 0.5},
+          "width": {"signal": "0.75 * width"},
+          "yc": {"scale": "y", "field": "precipitation"},
+          "height": {"value": 3}
+        }
+      }
+    }
+  ],
+  "scales": [
+    {
+      "name": "y",
+      "type": "linear",
+      "domain": {"data": "source_0", "field": "precipitation"},
+      "range": [{"signal": "height"}, 0],
+      "nice": true,
+      "zero": true
+    },
+    {
+      "name": "time",
+      "type": "band",
+      "domain": {"data": "source_0", "field": "date", "sort": true},
+      "range": {"step": 500}
+    }
+  ],
+  "axes": [
+    {
+      "scale": "y",
+      "orient": "left",
+      "grid": true,
+      "tickCount": {"signal": "ceil(height/40)"},
+      "domain": false,
+      "labels": false,
+      "aria": false,
+      "maxExtent": 0,
+      "minExtent": 0,
+      "ticks": false,
+      "zindex": 0
+    },
+    {
+      "scale": "y",
+      "orient": "left",
+      "grid": false,
+      "title": "precipitation",
+      "labelOverlap": true,
+      "tickCount": {"signal": "ceil(height/40)"},
+      "zindex": 0
+    }
+  ]
+}