Public
Edited
Apr 4, 2024
Fork of Waffle Chart
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
toCurrency = num => d3.format("$,.2f")(num)
Insert cell
color = d3.scaleOrdinal(d3.schemeTableau10)
.domain(sequence(chartData.length))
Insert cell
scale = d3.scaleBand()
.domain(sequence(10))
.range([0, waffleSize])
.padding(0.1)
Insert cell
sequence = (length) => Array.apply(null, {length: length}).map((d, i) => i);
Insert cell
whole = options.style === "whole"
Insert cell
isRect = options.shape === "rect"
Insert cell
Insert cell
Insert cell
width = 1024
Insert cell
height = 600
Insert cell
padding = ({x: 10, y: 40})
Insert cell
waffleSize = whole ? width < height ? width : height : 150;
Insert cell
import {form} from "@mbostock/form-input"
Insert cell
d3 = require("d3@6")
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more