我有以下功能用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可以帮助我吗?