[英]d3js: “Error: <circle> attribute cy: Expected length, ”NaN"
[英]D3js, circle inside a circle (arc), unable to move inner circle using cx and cy
因此,我一直將此代碼用作我嘗試創建的可視化的基礎: https : //bl.ocks.org/kgeorgiou/68f864364f277720252d0329408433ae
這個想法基本上是在節點對應的弧內添加圓。 這就是我希望cx和cy將內圓移動到適當位置,然后進行變形以分散它們的方法(變形部分確實起作用)。 但是,每個圓的位置都不會上下移動( cy :()。我知道問題不在於我正在計算的值,因為我還嘗試了通過將不同的值編碼到代碼中來測試不同的值檢查發生了什么,圓仍然不動,我想知道將圓附加到nodeElement對象時是否有問題。
function drawChildrenNodes(nodeElement, centroid, radius, cx, cy, options) {
var childrenNodeColor = getOptionOrDefault('childrenNodeColor', options);
var innerWidth = getOptionOrDefault('innerWidth', options);
nodeElement.append("circle")
.attr("cx", cx)
.attr("cy", cy)
.attr("r", radius-25)
.attr("fill", function (d) {
return childrenNodeColor;
})
.attr("stroke", function (d) {
return 'black';
})
.attr("stroke-width", innerWidth)
// .attr("transform", function(d) { return "translate(" + centroid + ")"; });
console.log('hey listen!'+cy)
}
隨附的示例說明了它的外觀。 我需要這些圓基於cy和cx移動。 如果您發現我在做什么錯,或者您需要更多信息以了解我的問題,請告訴我。 謝謝 !
因此,我發現了問題。 它實際上是在繼承父母的立場。 如果檢查index.html,則有一部分在其中設置圓的位置(所有類)。 因此,我將屬性類添加到了子圈子中,現在我只需要添加指定該類的位置即可:
d3.selectAll("circle.children").attr("cx", function (d) {
return d.x;
})
.attr("cy", function (d) {
return d.y;
});
對不起,噪音。 我還在學習D3js :)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.