[英]D3 transition isFinitDatae error
I'm new to D3.js & am trying to add a transition to an svg color change, but I'm getting Uncaught ReferenceError: isFinitDatae is not defined . 我是D3.js的新手,正在尝试向svg颜色更改添加过渡,但是我遇到了Uncaught ReferenceError:isFinitDatae未定义的问题 。
The svg circles that need to change color are set up like this: 需要更改颜色的svg圆设置如下:
var markers = mapContainer.selectAll("circle")
.data(mapLayer2.features)
.enter()
.append("circle")
.attr("cx", function(d){
return projection([d.geometry.coordinates[0],d.geometry.coordinates[1]])[0];
})
.attr("cy", function(d){ return projection([d.geometry.coordinates[0],d.geometry.coordinates[1]])[1]; })
.attr("r", 5)
.style("fill", function(d,i){
if(d.properties.entero_100ml_1 > 35){
return "#ff0000"
} else {
return "#ffcc00"
}
});
I have multiple buttons, and the color changes depend on which button is clicked. 我有多个按钮,颜色的变化取决于单击的按钮。 I tested clicking all of the buttons multiple times, and the color changes always work properly with this code: 我测试了多次单击所有按钮,并且颜色更改始终可以在此代码下正常工作:
var updateMarkers = function(enteroString)
{
markers.data(mapLayer2.features)
.style("fill", function(d,i){
var keyArray = d3.keys(d.properties);
var valueArray = d3.values(d.properties);
for (var j = 0; j < keyArray.length; j++){
if(keyArray[j] === enteroString){
if(valueArray[j] > 35){
return "#ff0000";
} else {
return "#ffcc00";
}
}
}
});
}
…but when I add transition, duration & ease the transition only works the first time a button is clicked, and the “Uncaught ReferenceError: isFinitDatae is not defined” is thrown: …但是当我添加过渡,持续时间和缓解过渡时,过渡仅在第一次单击按钮时有效,并且引发“未捕获的ReferenceError:isFinitDatae未定义”:
var updateMarkers = function(enteroString)
{
markers.data(mapLayer2.features)
.transition()
.duration(500)
.ease("quad")
.style("fill", function(d,i){
var keyArray = d3.keys(d.properties);
var valueArray = d3.values(d.properties);
for (var j = 0; j < keyArray.length; j++){
if(keyArray[j] === enteroString){
if(valueArray[j] > 35){
return "#ff0000";
} else {
return "#ffcc00";
}
}
}
});
}
Any ideas about how to fix the error, since this is working without the transition? 关于如何解决错误的任何想法,因为在没有过渡的情况下可以正常工作?
Any help is appreciated, thank you. 任何帮助表示赞赏,谢谢。
UPDATE: & here's where the updateMarkers is called: 更新:&这里是updateMarkers的调用位置:
chartContainer.selectAll("#xAxis text")
.attr("transform", function(d) {
return "translate(10,0)";
})
.style("cursor", "pointer")
.on("click", function(d,i) {
var num = i + 1;
var numString = num.toString();
var enteroString = "entero_100ml_" + numString;
updateMarkers(enteroString);
});
"isFinitDatae" is a typo in the version of D3 I was testing with. “ isFinitDatae”是我正在测试的D3版本中的错字。 In the latest version it's "isFinite", and transitions are working. 在最新版本中,它是“ isFinite”,并且过渡有效。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.