feat: optimize ID-driven selections (vega#7933)

Co-authored-by: GitHub Actions Bot <vega-actions-bot@users.noreply.github.com>
BradyJ27 · Oct 19, 2023 · 14565ee · 14565ee
1 parent 38ddc99
commit 14565ee
Show file tree

Hide file tree

Showing 31 changed files with 220 additions and 207 deletions.
diff --git a/examples/compiled/concat_hover.vg.json b/examples/compiled/concat_hover.vg.json
@@ -5,7 +5,10 @@
   "padding": 5,
   "height": 200,
   "data": [
-    {"name": "hover_store"},
+    {
+      "name": "hover_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "url": "data/cars.json",
@@ -65,7 +68,7 @@
           "on": [
             {
               "events": [{"source": "scope", "type": "mouseover"}],
-              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_0\", fields: hover_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_0\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
               "force": true
             },
             {
@@ -74,10 +77,6 @@
             }
           ]
         },
-        {
-          "name": "hover_tuple_fields",
-          "value": [{"type": "E", "field": "_vgsid_"}]
-        },
         {
           "name": "hover_toggle",
           "value": false,
@@ -115,7 +114,7 @@
               "fill": {"value": "transparent"},
               "stroke": [
                 {
-                  "test": "length(data(\"hover_store\")) && vlSelectionTest(\"hover_store\", datum)",
+                  "test": "length(data(\"hover_store\")) && vlSelectionIdTest(\"hover_store\", datum)",
                   "scale": "color",
                   "field": "Cylinders"
                 },
@@ -197,7 +196,7 @@
           "on": [
             {
               "events": [{"source": "scope", "type": "mouseover"}],
-              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_1\", fields: hover_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_1\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
               "force": true
             },
             {
@@ -206,10 +205,6 @@
             }
           ]
         },
-        {
-          "name": "hover_tuple_fields",
-          "value": [{"type": "E", "field": "_vgsid_"}]
-        },
         {
           "name": "hover_toggle",
           "value": false,
@@ -247,7 +242,7 @@
               "fill": {"value": "transparent"},
               "stroke": [
                 {
-                  "test": "length(data(\"hover_store\")) && vlSelectionTest(\"hover_store\", datum)",
+                  "test": "length(data(\"hover_store\")) && vlSelectionIdTest(\"hover_store\", datum)",
                   "scale": "color",
                   "field": "Cylinders"
                 },

diff --git a/examples/compiled/concat_hover_filter.vg.json b/examples/compiled/concat_hover_filter.vg.json
@@ -5,7 +5,10 @@
   "padding": 5,
   "height": 200,
   "data": [
-    {"name": "hover_store"},
+    {
+      "name": "hover_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "url": "data/cars.json",
@@ -28,7 +31,7 @@
       "transform": [
         {
           "type": "filter",
-          "expr": "length(data(\"hover_store\")) && vlSelectionTest(\"hover_store\", datum)"
+          "expr": "length(data(\"hover_store\")) && vlSelectionIdTest(\"hover_store\", datum)"
         }
       ]
     },
@@ -95,7 +98,7 @@
           "on": [
             {
               "events": [{"source": "scope", "type": "mouseover"}],
-              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_0_layer_0\", fields: hover_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_0_layer_0\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
               "force": true
             },
             {
@@ -104,10 +107,6 @@
             }
           ]
         },
-        {
-          "name": "hover_tuple_fields",
-          "value": [{"type": "E", "field": "_vgsid_"}]
-        },
         {
           "name": "hover_toggle",
           "value": false,
@@ -240,7 +239,7 @@
           "on": [
             {
               "events": [{"source": "scope", "type": "mouseover"}],
-              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_1_layer_0\", fields: hover_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+              "update": "datum && item().mark.marktype !== 'group' ? {unit: \"concat_1_layer_0\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
               "force": true
             },
             {
@@ -249,10 +248,6 @@
             }
           ]
         },
-        {
-          "name": "hover_tuple_fields",
-          "value": [{"type": "E", "field": "_vgsid_"}]
-        },
         {
           "name": "hover_toggle",
           "value": false,

diff --git a/examples/compiled/interactive_bar_select_highlight.vg.json b/examples/compiled/interactive_bar_select_highlight.vg.json
@@ -6,8 +6,14 @@
   "height": 200,
   "style": "cell",
   "data": [
-    {"name": "highlight_store"},
-    {"name": "select_store"},
+    {
+      "name": "highlight_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
+    {
+      "name": "select_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "values": [
@@ -68,16 +74,12 @@
       "on": [
         {
           "events": [{"source": "scope", "type": "mouseover"}],
-          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", fields: highlight_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
           "force": true
         },
         {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
       ]
     },
-    {
-      "name": "highlight_tuple_fields",
-      "value": [{"type": "E", "field": "_vgsid_"}]
-    },
     {
       "name": "highlight_toggle",
       "value": false,
@@ -103,16 +105,12 @@
       "on": [
         {
           "events": [{"source": "scope", "type": "click"}],
-          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", fields: select_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
           "force": true
         },
         {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
       ]
     },
-    {
-      "name": "select_tuple_fields",
-      "value": [{"type": "E", "field": "_vgsid_"}]
-    },
     {
       "name": "select_toggle",
       "value": false,
@@ -148,18 +146,18 @@
           "cursor": {"value": "pointer"},
           "fillOpacity": [
             {
-              "test": "!length(data(\"select_store\")) || vlSelectionTest(\"select_store\", datum)",
+              "test": "!length(data(\"select_store\")) || vlSelectionIdTest(\"select_store\", datum)",
               "value": 1
             },
             {"value": 0.3}
           ],
           "strokeWidth": [
             {
-              "test": "length(data(\"select_store\")) && vlSelectionTest(\"select_store\", datum)",
+              "test": "length(data(\"select_store\")) && vlSelectionIdTest(\"select_store\", datum)",
               "value": 2
             },
             {
-              "test": "length(data(\"highlight_store\")) && vlSelectionTest(\"highlight_store\", datum)",
+              "test": "length(data(\"highlight_store\")) && vlSelectionIdTest(\"highlight_store\", datum)",
               "value": 1
             },
             {"value": 0}

diff --git a/examples/compiled/interactive_multi_line_tooltip.vg.json b/examples/compiled/interactive_multi_line_tooltip.vg.json
@@ -6,7 +6,10 @@
   "height": 200,
   "style": "cell",
   "data": [
-    {"name": "hover_store"},
+    {
+      "name": "hover_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "url": "data/seattle-weather.csv",
@@ -49,16 +52,12 @@
       "on": [
         {
           "events": [{"source": "scope", "type": "mouseover"}],
-          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"layer_2\", fields: hover_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"layer_2\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
           "force": true
         },
         {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
       ]
     },
-    {
-      "name": "hover_tuple_fields",
-      "value": [{"type": "E", "field": "_vgsid_"}]
-    },
     {
       "name": "hover_toggle",
       "value": false,
@@ -139,7 +138,7 @@
         "update": {
           "stroke": [
             {
-              "test": "length(data(\"hover_store\")) && vlSelectionTest(\"hover_store\", datum)",
+              "test": "length(data(\"hover_store\")) && vlSelectionIdTest(\"hover_store\", datum)",
               "value": "black"
             },
             {"value": "transparent"}

diff --git a/examples/compiled/interactive_paintbrush.vg.json b/examples/compiled/interactive_paintbrush.vg.json
@@ -7,7 +7,10 @@
   "height": 200,
   "style": "cell",
   "data": [
-    {"name": "paintbrush_store"},
+    {
+      "name": "paintbrush_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "url": "data/cars.json",
@@ -40,16 +43,12 @@
           "events": [
             {"source": "scope", "type": "mouseover", "markname": "voronoi"}
           ],
-          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", fields: paintbrush_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
           "force": true
         },
         {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
       ]
     },
-    {
-      "name": "paintbrush_tuple_fields",
-      "value": [{"type": "E", "field": "_vgsid_"}]
-    },
     {
       "name": "paintbrush_toggle",
       "value": false,
@@ -93,7 +92,7 @@
           "y": {"scale": "y", "field": "Miles_per_Gallon"},
           "size": [
             {
-              "test": "!length(data(\"paintbrush_store\")) || vlSelectionTest(\"paintbrush_store\", datum)",
+              "test": "!length(data(\"paintbrush_store\")) || vlSelectionIdTest(\"paintbrush_store\", datum)",
               "value": 300
             },
             {"value": 50}

diff --git a/examples/compiled/interactive_paintbrush_color.vg.json b/examples/compiled/interactive_paintbrush_color.vg.json
@@ -7,7 +7,10 @@
   "height": 200,
   "style": "cell",
   "data": [
-    {"name": "paintbrush_store"},
+    {
+      "name": "paintbrush_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "url": "data/cars.json",
@@ -38,16 +41,12 @@
       "on": [
         {
           "events": [{"source": "scope", "type": "mouseover"}],
-          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", fields: paintbrush_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
           "force": true
         },
         {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
       ]
     },
-    {
-      "name": "paintbrush_tuple_fields",
-      "value": [{"type": "E", "field": "_vgsid_"}]
-    },
     {
       "name": "paintbrush_toggle",
       "value": false,
@@ -81,7 +80,7 @@
           "opacity": {"value": 0.7},
           "fill": [
             {
-              "test": "!length(data(\"paintbrush_store\")) || vlSelectionTest(\"paintbrush_store\", datum)",
+              "test": "!length(data(\"paintbrush_store\")) || vlSelectionIdTest(\"paintbrush_store\", datum)",
               "scale": "color",
               "field": "Cylinders"
             },

diff --git a/examples/compiled/interactive_paintbrush_color_nearest.vg.json b/examples/compiled/interactive_paintbrush_color_nearest.vg.json
@@ -7,7 +7,10 @@
   "height": 200,
   "style": "cell",
   "data": [
-    {"name": "paintbrush_store"},
+    {
+      "name": "paintbrush_store",
+      "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
+    },
     {
       "name": "source_0",
       "url": "data/cars.json",
@@ -40,16 +43,12 @@
           "events": [
             {"source": "scope", "type": "mouseover", "markname": "voronoi"}
           ],
-          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", fields: paintbrush_tuple_fields, values: [(item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]]} : null",
+          "update": "datum && item().mark.marktype !== 'group' ? {unit: \"\", _vgsid_: (item().isVoronoi ? datum.datum : datum)[\"_vgsid_\"]} : null",
           "force": true
         },
         {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
       ]
     },
-    {
-      "name": "paintbrush_tuple_fields",
-      "value": [{"type": "E", "field": "_vgsid_"}]
-    },
     {
       "name": "paintbrush_toggle",
       "value": false,
@@ -85,7 +84,7 @@
           "opacity": {"value": 0.7},
           "fill": [
             {
-              "test": "!length(data(\"paintbrush_store\")) || vlSelectionTest(\"paintbrush_store\", datum)",
+              "test": "!length(data(\"paintbrush_store\")) || vlSelectionIdTest(\"paintbrush_store\", datum)",
               "scale": "color",
               "field": "Cylinders"
             },