Forum Discussion

Anonymous's avatar
Anonymous
Not applicable
6 years ago
Solved

How to delete SVG-Elements after removing Field?

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!

 

  • 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 

1 Reply

  • 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