don’t filter extra unscaled channels (#1536)

Author: mbostock

src/mark.js

@@ -1,7 +1,7 @@
 import {channelDomain, createChannels, valueObject} from "./channel.js";
 import {defined} from "./defined.js";
 import {maybeFacetAnchor} from "./facet.js";
-import {maybeValues} from "./options.js";
+import {maybeValue} from "./options.js";
 import {arrayify, isDomainSort, isOptions, keyword, maybeNamed, range, singleton} from "./options.js";
 import {project} from "./projection.js";
 import {maybeClip, styles} from "./style.js";
@@ -39,7 +39,7 @@ export class Mark {
     }
     this.facetAnchor = maybeFacetAnchor(facetAnchor);
     channels = maybeNamed(channels);
-    if (extraChannels !== undefined) channels = {...maybeValues(maybeNamed(extraChannels)), ...channels};
+    if (extraChannels !== undefined) channels = {...maybeChannels(extraChannels), ...channels};
     if (defaults !== undefined) channels = {...styles(this, options, defaults), ...channels};
     this.channels = Object.fromEntries(
       Object.entries(channels)
@@ -133,3 +133,13 @@ export function marks(...marks) {
   marks.plot = Mark.prototype.plot; // Note: depends on side-effect in plot!
   return marks;
 }
+
+function maybeChannels(channels) {
+  return Object.fromEntries(
+    Object.entries(maybeNamed(channels)).map(([name, channel]) => {
+      channel = maybeValue(channel);
+      if (channel.filter === undefined && channel.scale == null) channel = {...channel, filter: null};
+      return [name, channel];
+    })
+  );
+}

src/marks/tip.js

@@ -1,6 +1,7 @@
 import {select} from "d3";
 import {getSource} from "../channel.js";
 import {create} from "../context.js";
+import {defined} from "../defined.js";
 import {formatDefault} from "../format.js";
 import {Mark} from "../mark.js";
 import {maybeAnchor, maybeFrameAnchor, maybeTuple, number, string} from "../options.js";
@@ -109,13 +110,15 @@ export class Tip extends Mark {
         if (key === "x1" && "x2" in sources) continue;
         if (key === "y1" && "y2" in sources) continue;
         const channel = sources[key];
+        const value = channel.value[i];
+        if (!defined(value) && channel.scale == null) continue;
         const color = channel.scale === "color" ? channels[key][i] : undefined;
         if (key === "x2" && "x1" in sources) {
           yield [formatLabel(scales, channel) ?? "x", formatPair(sources.x1, channel, i)];
         } else if (key === "y2" && "y1" in sources) {
           yield [formatLabel(scales, channel) ?? "y", formatPair(sources.y1, channel, i)];
         } else {
-          yield [formatLabel(scales, channel) ?? key, formatDefault(channel.value[i]), color];
+          yield [formatLabel(scales, channel) ?? key, formatDefault(value), color];
         }
       }
       if (index.fi != null && fx) yield [fx.label ?? "fx", formatFx(index.fx)];

src/options.js

@@ -328,15 +328,6 @@ export function maybeValue(value) {
   return value === undefined || isOptions(value) ? value : {value};
 }
 
-// Like maybeValue, but for an object for values.
-export function maybeValues(channels) {
-  return Object.fromEntries(
-    Object.entries(channels).map(([name, channel]) => {
-      return [name, maybeValue(channel)];
-    })
-  );
-}
-
 // Coerces the given channel values (if any) to numbers. This is useful when
 // values will be interpolated into other code, such as an SVG transform, and
 // where we don’t wish to allow unexpected behavior for weird input.