score:0

I managed to resolve the multiple lines by adding a small change to the script, so that only one line is drawn.

let line = d3.line()
                .x(d => xScale(d["x"]))
                .y(d => yScale(d["y"]))
                .curve(d3.curveCardinal); 

function updateLine(data){
    let g1 = svg.selectAll("path.line").data(**[**data**]**);
    g1
    .enter().append('path')
    .attr("class", "line")
    .merge(g1)
    .attr("d", line(data))
    .attr("fill", "none")
    .attr("stroke", "#348")
    .attr("stroke-width", "1px");
}

Any idea why this works?


Related Query

More Query from same tag