closes #1628

Author: Fil

src/interactions/pointer.js

@@ -22,6 +22,7 @@ function pointerK(kx, ky, {x, y, px, py, maxRadius = 40, channels, render, ...op
     // response to pointer events.
     render: composeRender(function (index, scales, values, dimensions, context, next) {
       const svg = context.ownerSVGElement;
+      const {data} = context.getMarkState(this);
 
       // Isolate state per-pointer, per-plot; if the pointer is reused by
       // multiple marks, they will share the same state (e.g., sticky modality).
@@ -144,6 +145,7 @@ function pointerK(kx, ky, {x, y, px, py, maxRadius = 40, channels, render, ...op
         if (state.sticky) (state.sticky = false), state.renders.forEach((r) => r(null)); // clear all pointers
         else state.sticky = true;
         event.stopImmediatePropagation(); // suppress other pointers
+        if (state.sticky) context.dispatchValue(data[i]);
       }
 
       function pointerleave(event) {

src/plot.js

@@ -262,6 +262,13 @@ export function plot(options = {}) {
     )
     .call(applyInlineStyles, style);
 
+  // A listener that will dispatch an input event on the figure element
+  let figure = svg;
+  context.dispatchValue = function (value) {
+    figure.value = value;
+    figure.dispatchEvent(new CustomEvent("input"));
+  };
+
   // Render marks.
   for (const mark of marks) {
     const {channels, values, facets: indexes} = stateByMark.get(mark);
@@ -311,7 +318,6 @@ export function plot(options = {}) {
   }
 
   // Wrap the plot in a figure with a caption, if desired.
-  let figure = svg;
   const legends = createLegends(scaleDescriptors, context, options);
   if (caption != null || legends.length > 0) {
     figure = document.createElement("figure");