Public
Edited
Jun 9, 2023
1 fork
{
const width = 600;
const height = 500;
const lines = data.lines.reverse();
const b = bounds(data.lines);
const scaleX = d3.scaleLinear().domain([b[0], b[2]]).range([10, width-10]);
const scaleY = d3.scaleLinear().domain([b[1], b[3]]).range([10, height-10]);
const line = d3.line().x(d => scaleX(d.x)).y(d => scaleY(d.y));
const svg = d3.create('svg')
.attr('width', width)
.attr('height', height);
svg.selectAll('path')
.data(lines)
.enter()
.append('path')
.attr('d', line)
.attr('stroke','black')
.attr('strokeWidth',1)
.attr('fill', 'none');
return svg.node();
}
data = linedata(L(parse(definition)), 4)
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.
