How to delete SVG-Elements after removing Field?

[Anonymous]

Hi Folks,

Like the title says I have some elements which renders fine, when adding the corresponding field.

My problem is now, if I remove those fields, the svg elements in the reports won't delete, they stay!

First I check if there is any value in the corresponding field, if yes i render the lines as follow:

let upperValues = this.upperLimit
                .selectAll(".line")
                .data(viewModelUpper.dataPoints)
                .join("line")
                .classed("line", true);


            upperValues.attr("x1", d => xScale(d.category) + (this.settin.axis.x.padding / 2) - (upperWidth / 2))
                .attr("y1", d => yScale(d.upperLimit))
                .attr("x2", d => xScale(d.category) + (this.settin.axis.x.padding / 2) + (upperWidth / 2))
                .attr("y2", d => yScale(d.upperLimit))
                .attr("stroke-width", upperThickness)
                .attr("stroke", upperLineColor);

But if I remove the corresponding field, the lines won't delete. Is there a function on how to delete those, and still being able to redraw it later?

Thansk in advance for your help!

[paul-maessen · Accepted solution]

@Anonymous 

I am not sure about the rest of your code, but you could use the d3-method to remove a selection.

If you detect that the fields are removed and the lines have to be removed you can use:

this.upperLimit.selectAll(".line").remove();

Not sure if you are looking for this...

Regards

Paul