爲什麼我不能在d3中多次創建一個包含數據集的圓圈組？

m創建一個散點圖，我有問題繪製我的圈子（數據點）。爲什麼我不能在d3中多次創建一個包含數據集的圓圈組？

當追加第一組圓圈時，它在圖形上繪製得很好。然而，我嘗試追加的下一集不會因爲某些原因而被繪製。怎麼會這樣？第二次使用Enter/append/select錯誤嗎？

我有一個的jsfiddle我的代碼：http://jsfiddle.net/4wptM/

我已經未註釋其中I加載和操縱我的數據並建立與較小的樣本在相同的陣列的部分。可以看出只有第一組圓圈被顯示，而第二組圓圈沒有被顯示。

我的圓弧部分的代碼粘貼如下：

var circle = SVGbody 
      .selectAll("circle") 
      .data(graphData[0]) 
      .enter() 
       .append("circle") 
       .attr("cx",function(d){return xScale(100);}) 
       .attr("cy",function(d){return yScale(parseFloat(d))}) 
       .attr("r",5); 

    circle = SVGbody 
      .selectAll("circle") 
      .data(graphData[1]) 
      .enter() 
       .append("circle") 
       .attr("cx",function(d){return xScale(200);}) 
       .attr("cy",function(d){return yScale(parseFloat(d))}) 
       .attr("r",5);

我只是那些2複製到試圖找出問題。我的實際代碼在以下for循環中。當我在這個循環中運行它，它借鑑了當時該指數爲1的圓和幾個當該指數3

for(var i = 0;i < graphData.length;i++){ 
     var circle = SVGbody 
      .selectAll("circle") 
      .data(graphData[i]) 
      .enter() 
       .append("circle") 
       .attr("cx",function(d){return xScale((i*100)+100);}) 
       .attr("cy",function(d){return yScale(parseFloat(d))}) 
       .attr("r",20); 
     //console.log(i + " ::::::: " + graphData[i]) 
    }

一些幫助將因此大受appretiated。我真的搞不清楚我做錯了什麼。

來源

2014-04-04 Vanquiza

爲什麼你問同樣的問題10小時後第二次？ http://stackoverflow.com/questions/22851064/why-cant-i-create-a-group-of-circles-twice-in-d3 – Andreas

這是一個錯誤。我現在刪除了舊的。 – Vanquiza

當在一組現有的元素上操作時（因爲這是第二種情況.selectAll("circle").data()方法只使用這些數組中沒有對應索引的元素，爲了防止這種行爲，。將具有添加一個關鍵功能的.data()第二參數所解釋here和here

這裏這個函數只具有返回數組的每個元素：

function (d) { 
    return d; 
}

在FID DLE它會是這個樣子：

var circle = SVGbody 
       .selectAll("circle") 
       .data(graphData[0], function(d) { return d; }) // <-- this one 
       .enter() 
       .append("circle") 
       .attr("cx",function(d){return xScale(100);}) 
       .attr("cy",function(d){return yScale(parseFloat(d))}) 
       .attr("r",5);

fiddle

而改變，你必須使用.style("fill", ...)元素的填充顏色，而不是.attr("fill", ...)

.style("fill", "green")

來源

2014-04-04 10:23:45 Andreas

非常感謝。這幫了我很多。在使用我的數據而不是一些測試圈後，我的變焦開始出現故障。它放大，但推動所有的圈子左側。知道爲什麼發生這種情況？ – Vanquiza

爲什麼我不能在d3中多次創建一個包含數據集的圓圈組？

回答

相關問題