。數據（）結合

Question

我使用D3的力指向圖建立一個模擬疫情僅第一要素。

當傳輸事件發生時，我想從發射器的圓圈移動到新感染的個體。

問題：僅在創建第一元件和根據所述綁定數據移動。

首先，我收集的座標：

xyCoords = getPathogen_xyCoords(newInfections); 

凡xyCoords如下所示：

{receiverX: newInfections[i].x, receiverY: newInfections[i].y, transmitterX: newInfections[i].infectedBy.x, transmitterY: newInfections[i].infectedBy.y} 

然後，我創建的圈子並將其綁定到xyCoords：

d3.select(".svg").append("circle") 
    .attr("class", "pathogen") 


d3.selectAll(".pathogen") 
    .data(xyCoords) 
    .attr("cx", function(d) { return d.transmitterX}) 
    .attr("cy", function(d) { return d.transmitterY}) 
    .attr("r", 4) 
    .style("fill", "green") 

最後，該圓被移動：

d3.selectAll(".pathogen") 
     .transition() 
     .duration(500) 
     .attr("cx", function(d) { return d.receiverX}) 
     .attr("cy", function(d) { return d.receiverY}); 

編輯：遊戲已經上漲了幾個月，做得相當好！查看http://vax.herokuapp.com！

Answer 1

我已經解決了我的問題......

在創建圓的，我是不是「進入」新的社交圈與新綁定的數據相關聯。

它被綁定上只顯示所述第一元件，因爲只有一個圓開始。

創作界現在看起來是這樣的：

xyCoords = getPathogen_xyCoords(newInfections); 

var pathogen = svg.selectAll(".pathogen") 
    .data(xyCoords) 
    .enter() 
    .append("circle") 
    .attr("class", "pathogen") 
    .attr("cx", function(d) { return d.transmitterX }) 
    .attr("cy", function(d) { return d.transmitterY }) 
    .attr("r", 4) 
    .style("fill", "green")