我是 Pythonista，正在尝试学习 d3.js（微笑）。
我有一个带有套接字的服务器。我的页面订阅了它。
服务器以 JSON 形式发送更新'[["id0", 0.38], ["id1", 0.70], ["id8", 0.71]]'。
我写了以下简单的页面：
<!doctype html>
<html>
<head>
<title>WebSockets</title>
</head>
<body>
<script src="http://d3js.org/d3.v2.js"></script>
<script>
var ws = new WebSocket("ws://localhost:9999/updates");
ws.onmessage = function(message)
{
var my_data = JSON.parse(message.data);
var dd = d3.selectAll("#messages")
.append("div")
.selectAll("div")
.data(my_data)
.enter()
.append("div")
.attr("id",function(d){return d[0];})
.text(function(d){return d[1];})
}
</script>
<div id='messages'></div>
</body>
</html>
效果很好！ WS接收数据。在里面div#messages它创造了一个新的div。然后将 msg 中的数据放入div#id*。所以，经过多次迭代我有：
...
<div id="messages">
<div>
<div id="id0">0.83</div>
<div id="id1">0.06</div>
<div id="id2">0.33</div>
</div>
<div>
...
</div>
<div>
...
</div>
...
</div>
...
如何修改代码以使其像这样工作：
Having
...
<div id='messages'>
<div id='id0'>0.25</div>
<div id='id1'>0.05</div>
<div id='id2'>0.25</div>
</div>
...
Recieve
'[["id0", 0.38], ["id1", 0.70], ["id8", 0.71]]'
得到结果
...
<div id='messages'>
<div id='id0'>0.38</div>
<div id='id1'>0.70</div>
<div id='id2'>0.25</div>
<div id='id8'>0.71</div>
</div>
...
我的意思是“如果在 #messages 中给定了 id，则更新它；否则将其附加到末尾”.
我可以用循环来做到这一点，但医生说这应该用enter() and exit()..
似乎在这些文章中（circle http://mbostock.github.com/d3/tutorial/circle.html, join http://bost.ocks.org/mike/join/）写了如何做到这一点。
问题是我根本不明白这些文章中数据同步的思想。
我希望代码能帮助我理解这一点。
PS:我用 Python 完成所有逻辑，但是，我必须以最少的重绘在页面上显示数据。每个人都说 d3 - 非常简单和方便。我阅读了文档，似乎 d3 是一个很好的框架，但我在基础知识方面遇到了一些麻烦。
PPS:如果数据应该以其他方式传输 - 没有问题。
UPDATE
在控制台的帮助下，我发现，
d3.select("#messages")
.select("div")
.selectAll("div")
.data([["id0",0]], function(d){return d[0];})
.enter()
给我数组[null]
d3.select("#messages")
.select("div")
.selectAll("div")
.data([["id0",0]], function(d){return d[0];})
给我数组[HTMLDivElement] with HTMLDivElement.__data__ == ["id0",0]
and
d3.select("#messages")
.select("div")
.selectAll("div")
.data([["id0",0]], function(d){return d[0];})
.exit()
gives [null, HTMLDivElement, HTMLDivElement] with "id1" and "id2" in HTMLDivElement.__data__[0]分别。
知道下一步怎么办吗？
