Public
Edited
Sep 23, 2023
Fork of Simple D3
Insert cell
Insert cell
category-brands.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
chart = {
const width = window.innerWidth * 0.8; // uncomment for responsive width
const height = 200;
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, height])
.attr("width", width)
.attr("height", height)
.attr("style", "max-width: 100%; height: auto;")
.attr("background-color", "blue");

svg
.selectAll("circle")
.data(d3.range(18))
.join("circle")
.attr("cx", d => 30 + d * 50)
.attr("cy", height / 2)
.attr("r",[1,2,3,4,50,6])
.attr("fill", "lime");
return svg.node();
}
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