Better one-dimensional cell defaults (#347)

* Update README

* better one-dimensional cell defaults

* fix tests

* no default identity fill if stroke channel

Co-authored-by: Philippe Rivière <fil@rezo.net>

Author: mbostock

src/marks/cell.js

@@ -1,4 +1,4 @@
-import {identity, maybeTuple} from "../mark.js";
+import {identity, indexOf, maybeColor, maybeTuple} from "../mark.js";
 import {AbstractBar} from "./bar.js";
 
 export class Cell extends AbstractBar {
@@ -25,10 +25,12 @@ export function cell(data, {x, y, ...options} = {}) {
   return new Cell(data, {...options, x, y});
 }
 
-export function cellX(data, {x = identity, ...options} = {}) {
-  return new Cell(data, {...options, x});
+export function cellX(data, {x = indexOf, fill, stroke, ...options} = {}) {
+  if (fill === undefined && maybeColor(stroke)[0] === undefined) fill = identity;
+  return new Cell(data, {...options, x, fill, stroke});
 }
 
-export function cellY(data, {y = identity, ...options} = {}) {
-  return new Cell(data, {...options, y});
+export function cellY(data, {y = indexOf, fill, stroke, ...options} = {}) {
+  if (fill === undefined && maybeColor(stroke)[0] === undefined) fill = identity;
+  return new Cell(data, {...options, y, fill, stroke});
 }

test/marks/cell-test.js

@@ -73,18 +73,18 @@ tape("cellX() defaults x to identity and y to null", test => {
   const cell = Plot.cellX();
   test.strictEqual(cell.data, undefined);
   test.strictEqual(cell.transform, undefined);
-  test.deepEqual(cell.channels.map(c => c.name), ["x"]);
-  test.deepEqual(cell.channels.map(c => Plot.valueof([1, 2, 3], c.value)), [[1, 2, 3]]);
-  test.deepEqual(cell.channels.map(c => c.scale), ["x"]);
+  test.deepEqual(cell.channels.map(c => c.name), ["x", "fill"]);
+  test.deepEqual(cell.channels.map(c => Plot.valueof([1, 2, 3], c.value)), [[ 0, 1, 2 ], [ 1, 2, 3 ]]);
+  test.deepEqual(cell.channels.map(c => c.scale), ["x", "color"]);
   test.strictEqual(cell.channels.find(c => c.name === "x").type, "band");
 });
 
 tape("cellY() defaults y to identity and x to null", test => {
   const cell = Plot.cellY();
   test.strictEqual(cell.data, undefined);
   test.strictEqual(cell.transform, undefined);
-  test.deepEqual(cell.channels.map(c => c.name), ["y"]);
-  test.deepEqual(cell.channels.map(c => Plot.valueof([1, 2, 3], c.value)), [[1, 2, 3]]);
-  test.deepEqual(cell.channels.map(c => c.scale), ["y"]);
+  test.deepEqual(cell.channels.map(c => c.name), ["y", "fill"]);
+  test.deepEqual(cell.channels.map(c => Plot.valueof([1, 2, 3], c.value)), [[ 0, 1, 2 ], [ 1, 2, 3 ]]);
+  test.deepEqual(cell.channels.map(c => c.scale), ["y", "color"]);
   test.strictEqual(cell.channels.find(c => c.name === "y").type, "band");
 });

test/output/highCardinalityOrdinal.svg

@@ -6,7 +6,7 @@ export default async function() {
       type: "ordinal"
     },
     marks: [
-      Plot.cellX("ABCDEFGHIJKLMNOPQRSTUVWXYZ", {fill: d => d})
+      Plot.cellX("ABCDEFGHIJKLMNOPQRSTUVWXYZ")
     ]
   });
 }