visData.js
import { select, line } from 'd3';
export const visData = (selection, data) => {
// const circles = svg.selectAll('circle').data(data);
// const circlesEnter = circles
// .enter()
// .append('circle')
// .attr('r', 20);
// circles
// .merge(circlesEnter)
// .attr('cx', (d) => d.x)
// .attr('cy', (d) => d.y);
// circles.exit().remove();
const lineGenerator = line()
.x((d) => d.x)
.y((d) => d.y);
// this goes first
selection
.selectAll('path')
.data([null])
.join('path')
.attr('d', lineGenerator(data))
.attr('fill', 'none')
.attr('stroke', 'black');
selection
.selectAll('circle')
.data(data)
.join('circle')
.attr('r', (d) => d.r)
.attr('cx', (d) => d.x)
ISC Licensed