D3防止附加重复项

时间:2016-05-19 12:34:50

标签: javascript d3.js svg duplicates

我有以下功能用D3绘制不同的SVG形状。

updateChart(props){
var svg = d3.select(this.refs.svg);
let prefix = "XX";
 // Render SVG Tags with ID and without attributes first
  let objectsRender = svg.selectAll("line")
                       .data(props.data)
                       .enter()
                       .append(function(d) {
                            return document.createElementNS(
                            "http://www.w3.org/2000/svg",
                             d.objType);
                         })
                       .attr("id", function(d){ return prefix +d._id;})
                       .attr("class", "no-attr")
                       .on("click",(d)=>{this.modeClick(d);});

 // Set Attributes for all classes with no attributes set so far

 let objectsAttributes=  svg.selectAll(".no-attr").each(function(){
    let id= d3.select(this).attr("id");
    let data = null;
    data = props.data[0];

    for(i = 0;i < props.data.length; i++){
      if(id == prefix +props.data[i]._id){
        data = props.data[i];
        break;
      }
    }

    if( data !== null){
    d3.select(this)
      .attr(data.coordinates)
      .attr(data.style)
      .attr("class", null);
    }

  }
);
}

props.data包含具有相关svg数据的所有对象。 我现在遇到的问题是,有时调用此方法时, D3开始复制已存在的SVG元素,即使props.data中的数据量没有改变。

anyoe可以帮助我吗?

0 个答案:

没有答案