The avatar for @cbush
Caroline Bush
Public
Edited
Feb 8, 2023
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
count = 1012
Insert cell
Insert cell
<div id="mosaic"></div>
Insert cell
randColor = () => {
let r = Math.random() * 255;
let g = Math.random() * 255;
let b = Math.random() * 255
return "rgb(" + r + "," + g + "," + b + ")";
}
Insert cell
randColor()
Insert cell
boxes = d3.select(mosaic)
.selectAll("div")
.data(d3.range(count))
.join("div")
.style("background-color", randColor)
Insert cell
Insert cell
<svg id="randcircles" width="400" height="400"></svg>
Insert cell
randLocation =() => Math.random() * 400
Insert cell
circles = d3.select(randcircles)
.selectAll("circle")
.data(d3.range(count))
.join("circle")
.attr("cx", randLocation)
.attr("cy", randLocation)
.attr("r", 8)
.style("fill", "violet")
.style("stroke", "black")
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