Published
Edited
Dec 1, 2020
Insert cell
Insert cell
Insert cell
html`
<svg height="500" width="500" id='container'>
</svg>`
Insert cell
viewof SimpleTest = {
let drawCirclesWithJoinSimple = (containerId, dataArray) =>
{
let svg = d3.select(containerId);
let circles = svg.selectAll('circle')
.data(dataArray)
.join('circle')
.attr('cx', d => d[0])
.attr('cy', d => d[1])
.attr('stroke', 'firebrick')
.attr('stroke-width', 1)
.attr('r', 2)
.attr('fill', 'wheat');
}
let xyPoints = [];
const num_points = 10000;
for (let i=0; i < num_points; i++)
{
let x = Math.random() * 500;
let y = Math.random() * 500;
xyPoints.push([x,y]);
}

drawCirclesWithJoinSimple('#container', xyPoints);

return md`**Simple Test**`}
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