Merge branch 'main' into claude/2328

Author: Fil

docs/marks/area.md

@@ -205,7 +205,7 @@ Plot.plot({
 ```
 :::
 
-To vary **fill** within a single series, set the **z** option to null.
+To vary **fill** within a single series, set the **z** option to null. For areaY, **z** defaults to null if the **fill** and **y** channels are strictly equal, as when the color encoding is redundant with position; for areaX, **z** defaults to null if **fill** and **x** are strictly equal. <VersionBadge pr="2379" />
 
 :::plot defer https://observablehq.com/@observablehq/plot-variable-fill-area
 ```js

docs/marks/line.md

@@ -176,7 +176,7 @@ Plot.plot({
 Here the [normalize transform](../transforms/normalize.md) normalizes each time series (**z**) relative to its initial value, while the [select transform](../transforms/select.md) extracts the last point for labeling. A custom tick format converts multiples to percentage change (*e.g.*, 1.6× = +60%).
 :::
 
-Varying-color lines are supported. If the **stroke** value varies within series, the line will be segmented by color. (The same behavior applies to other channels, such as **strokeWidth** and **title**.) Specifying the **z** channel (say to null for a single series) is recommended.
+Varying-color lines are supported. If the **stroke** value varies within series, the line will be segmented by color. (The same behavior applies to other channels, such as **strokeWidth** and **title**.) The **z** channel determines how data is grouped into series.
 
 :::plot defer https://observablehq.com/@observablehq/plot-varying-stroke-line
 ```js
@@ -201,6 +201,14 @@ Plot.plot({
 ```
 :::
 
+If the **stroke** and **y** channels are strictly equal, as when the color encoding is redundant with position, **z** defaults to null, producing a single varying-color line. <VersionBadge pr="2379" />
+
+:::plot
+```js
+Plot.lineY(aapl, {x: "Date", y: "Close", stroke: "Close"}).plot({y: {grid: true}})
+```
+:::
+
 Color encodings can also be used to highlight specific series, such as here to emphasize high unemployment in Michigan.
 
 :::plot defer https://observablehq.com/@observablehq/plot-multiple-line-highlight

src/interactions/pointer.js

@@ -4,6 +4,7 @@ import {isArray} from "../options.js";
 import {applyFrameAnchor} from "../style.js";
 
 const states = new WeakMap();
+const handledEvents = new WeakSet();
 
 function pointerK(kx, ky, {x, y, px, py, maxRadius = 40, channels, render, ...options} = {}) {
   maxRadius = +maxRadius;
@@ -162,12 +163,13 @@ function pointerK(kx, ky, {x, y, px, py, maxRadius = 40, channels, render, ...op
       }
 
       function pointerdown(event) {
+        if (handledEvents.has(event)) return; // ignore same event on a shared pointer
+        handledEvents.add(event);
         if (event.pointerType !== "mouse") return;
         if (i == null) return; // not pointing
         if (state.sticky && state.roots.some((r) => r?.contains(event.target))) return; // stay sticky
         if (state.sticky) (state.sticky = false), state.renders.forEach((r) => r(null)); // clear all pointers
         else (state.sticky = true), render(i);
-        event.stopImmediatePropagation(); // suppress other pointers
       }
 
       function pointerleave(event) {

src/marker.js

@@ -45,6 +45,7 @@ function markerArrow(orient) {
       .attr("orient", orient)
       .attr("fill", "none")
       .attr("stroke", color)
+      .attr("stroke-dasharray", "none")
       .attr("stroke-width", 1.5)
       .attr("stroke-linecap", "round")
       .attr("stroke-linejoin", "round")
@@ -70,6 +71,7 @@ function markerCircleFill(color, context) {
     .attr("markerHeight", 6.67)
     .attr("fill", color)
     .attr("stroke", "var(--plot-background)")
+    .attr("stroke-dasharray", "none")
     .attr("stroke-width", 1.5)
     .call((marker) => marker.append("circle").attr("r", 3))
     .node();
@@ -82,6 +84,7 @@ function markerCircleStroke(color, context) {
     .attr("markerHeight", 6.67)
     .attr("fill", "var(--plot-background)")
     .attr("stroke", color)
+    .attr("stroke-dasharray", "none")
     .attr("stroke-width", 1.5)
     .call((marker) => marker.append("circle").attr("r", 3))
     .node();
@@ -95,6 +98,7 @@ function markerTick(orient) {
       .attr("markerHeight", 6)
       .attr("orient", orient)
       .attr("stroke", color)
+      .attr("stroke-dasharray", "none")
       .call((marker) => marker.append("path").attr("d", "M0,-3v6"))
       .node();
 }

src/marks/area.js

@@ -71,11 +71,11 @@ export function area(data, options) {
 }
 
 export function areaX(data, options) {
-  const {y, ...rest} = maybeDenseIntervalY(options);
-  return new Area(data, maybeStackX({...rest, y1: y, y2: undefined}));
+  const {x, y, fill, z = x === fill ? null : undefined, ...rest} = maybeDenseIntervalY(options);
+  return new Area(data, maybeStackX({...rest, x, y1: y, y2: undefined, z, fill}));
 }
 
 export function areaY(data, options) {
-  const {x, ...rest} = maybeDenseIntervalX(options);
-  return new Area(data, maybeStackY({...rest, x1: x, x2: undefined}));
+  const {x, y, fill, z = y === fill ? null : undefined, ...rest} = maybeDenseIntervalX(options);
+  return new Area(data, maybeStackY({...rest, x1: x, x2: undefined, y, z, fill}));
 }

src/marks/line.js

@@ -3,7 +3,7 @@ import {create} from "../context.js";
 import {curveAuto, maybeCurveAuto} from "../curve.js";
 import {Mark} from "../mark.js";
 import {applyGroupedMarkers, markers} from "../marker.js";
-import {coerceNumbers, maybeTuple, maybeZ} from "../options.js";
+import {coerceNumbers, identity, indexOf, maybeTuple, maybeZ} from "../options.js";
 import {applyDirectStyles, applyIndirectStyles, applyTransform, applyGroupedChannelStyles} from "../style.js";
 import {groupIndex} from "../style.js";
 import {maybeDenseIntervalX, maybeDenseIntervalY} from "../transforms/bin.js";
@@ -98,10 +98,10 @@ export function line(data, {x, y, ...options} = {}) {
   return new Line(data, {...options, x, y});
 }
 
-export function lineX(data, options) {
-  return new Line(data, maybeDenseIntervalY(options));
+export function lineX(data, {x = identity, y = indexOf, stroke, z = stroke === x ? null : undefined, ...options} = {}) {
+  return new Line(data, maybeDenseIntervalY({...options, x, y, z, stroke}));
 }
 
-export function lineY(data, options) {
-  return new Line(data, maybeDenseIntervalX(options));
+export function lineY(data, {x = indexOf, y = identity, stroke, z = stroke === y ? null : undefined, ...options} = {}) {
+  return new Line(data, maybeDenseIntervalX({...options, x, y, z, stroke}));
 }

src/marks/tip.js

@@ -347,8 +347,8 @@ function getSourceChannels(channels, scales) {
     if ((key === "x" || key === "y") && channels.geometry) continue; // ignore x & y on geo
     const source = getSource(channels, key);
     if (source) {
-      // Ignore color channels if the values are all literal colors.
-      if (source.scale == null && source.defaultScale === "color") continue;
+      // Ignore (e.g., color) channels if the values are all literal.
+      if (source.scale == null && source.defaultScale) continue;
       sources[key] = source;
     }
   }

src/transforms/dodge.js

@@ -78,7 +78,7 @@ function dodge(y, x, anchor, padding, r, options) {
     const radius = R ? (i) => R[i] : () => cr;
     for (let I of facets) {
       const tree = IntervalTree();
-      I = I.filter(R ? (i) => finite(X[i]) && positive(R[i]) : (i) => finite(X[i]));
+      I = I.filter(R ? (i) => finite(X[i]) && positive(R[i]) : cr > 0 ? (i) => finite(X[i]) : () => false);
       const intervals = new Float64Array(2 * I.length + 2);
       for (const i of I) {
         const ri = radius(i);