score:1

Accepted answer

Calculate the point cooridnates on each update, select the point if it's already created or create a new one:

const lastData = data[data.length-1];
const y = yScale(lastData.index));
const x = xScale(lastData.week));

let lastPoint = svg.select('.last-point');
let lastLine = svg.select('.last-line');
if (!lastPoint.node()) {
  lastPoint = svg.append('circle')
    .classed('last-point', true)
    .style('fill', 'purple')
    .attr('r', 7.5);
  lastLine = svg.append('line')
    .classed('last-line', true)
    .attr('stroke-dasharray', '5,5')
    .style('stroke', 'gray');
}

lastPoint
  .attr('cx', x)
  .attr('cy', y);

lastLine
  .attr('x1', x)
  .attr('x2', x)
  .attr('y1', y)
  .attr('y2', height);

Related Query

More Query from same tag