創建位置/和循環使用D3使用的JavaScript /或咖啡

「G」和SVG

，所以我想單獨的每個cicle到這個樣子創建位置/和循環使用D3使用的JavaScript /或咖啡

![enter image description here][1]

這裏 enter image description here

添加文本但裏面的內容，但我不能」弄明白怎麼我的圈子裏就不會傳播出去，因爲我用下面

svg_w = 800 
svg_h = 400 
svg = d3.select("body").append("svg").attr("width", svg_w).attr("weight", svg_h) 

list = [1,2,3,4,5] 
dataset = (x*10 for x in list) 
console.log dataset 


nodes = svg.append("g").attr("class", "nodes").selectAll("circle") 
     .data(dataset).enter().append("g") 
      .attr("transform", (d, i) -> 

        d.x = i * 70 + 50 
        d.y = svg_h/2 

        "translate(" + d.x + "," + d.y + ")" 

       ) 

nodes.append("circle").attr("class", "node").attr "r", 20 
nodes.append("text").attr("text-anchor", "middle").text (d) ->d.name

這coffescript代碼我的結果顯示我的圈子左上角絡筒機

enter image description here

什麼建議嗎？

感謝

來源

2014-02-24 JPC

「重量」屬性應該是「高度」，但除此之外它看起來應該起作用。 –

的問題是，你要設置一些屬性（d.x和d.y），而不是一個對象。這不起作用，你的翻譯是不確定的。改用單獨的變量，例如

dx = i * 70 + 50 
dy = svg_h/2 
"translate(" + dx + "," + dy + ")"

由於您引用的屬性.name不存在，因此文本不顯示。此外，黑色圓圈上的黑色文字不可見。您可以通過給文本不同的顏色，並附加數量作爲文本很容易解決這個問題：

nodes.append("text").attr("text-anchor", "middle").text (d) ->d

完整的示例here。

來源

2014-02-24 13:17:43

非常感謝，現在有意義。最佳答案我有！非常清楚：-）！！ – JPC

我想弄明白爲什麼文字不會顯示在我的圈子中間。（「text」）。attr（「text-anchor」，「middle」）。text（d） - > d.name認爲我已經做了我應該做的一切。 – JPC

對不起，錯過了那部分 - 仍然jetlagged。將更新答案。 –

創建位置/和循環使用D3使用的JavaScript /或咖啡

回答

相關問題