diff --git a/README.md b/README.md index 466b21a436..73fc89cca0 100644 --- a/README.md +++ b/README.md @@ -363,6 +363,8 @@ The following *facet* options are supported: * facet.**marginLeft** - * facet.**grid** - +TODO Describe how data is faceted according to strict equality (`===`): if a mark’s data is strictly equal to the facet data, the mark is faceted; otherwise, the mark is repeated for each facet. You can disable faceting for a specific mark by giving it a shallow copy of the data. + ## Marks Marks visualize data as geometric shapes such as bars, dots, and lines. An single mark can generate multiple shapes: for example, passing a [Plot.barY](#plotbarydata-options) to [Plot.plot](#plotplotoptions) will produce a bar for each element in the associated data. Multiple marks can be layered into plots. diff --git a/src/marks/cell.js b/src/marks/cell.js index 5191d413f3..39611ed573 100644 --- a/src/marks/cell.js +++ b/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}); } diff --git a/test/marks/cell-test.js b/test/marks/cell-test.js index c742ea3eca..d8d15793ea 100644 --- a/test/marks/cell-test.js +++ b/test/marks/cell-test.js @@ -73,9 +73,9 @@ 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"); }); @@ -83,8 +83,8 @@ 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"); }); diff --git a/test/output/highCardinalityOrdinal.svg b/test/output/highCardinalityOrdinal.svg index c37f98708f..e186f4c46c 100644 --- a/test/output/highCardinalityOrdinal.svg +++ b/test/output/highCardinalityOrdinal.svg @@ -1,82 +1,82 @@ - A + 0 - B + 1 - C + 2 - D + 3 - E + 4 - F + 5 - G + 6 - H + 7 - I + 8 - J + 9 - K + 10 - L + 11 - M + 12 - N + 13 - O + 14 - P + 15 - Q + 16 - R + 17 - S + 18 - T + 19 - U + 20 - V + 21 - W + 22 - X + 23 - Y + 24 - Z + 25 diff --git a/test/plots/high-cardinality-ordinal.js b/test/plots/high-cardinality-ordinal.js index 93173168a5..fd16628e47 100644 --- a/test/plots/high-cardinality-ordinal.js +++ b/test/plots/high-cardinality-ordinal.js @@ -6,7 +6,7 @@ export default async function() { type: "ordinal" }, marks: [ - Plot.cellX("ABCDEFGHIJKLMNOPQRSTUVWXYZ", {fill: d => d}) + Plot.cellX("ABCDEFGHIJKLMNOPQRSTUVWXYZ") ] }); }