私のコードでは、終了の選択と同様に、更新の選択は常に空であるため、遷移は実行されません。更新するたびに、DOMフラグメント全体を以前には存在しなかったかのように再描画することになります(つまり、.enter以外のすべてを削除でき、動作は変わりません)。
data()のキー関数を使用して、位置ではなく一意の値で結合が行われるようにしています。
コード全体はhttp://jsfiddle.net/colin_young/xRQjX/23/にありますが、ここで関連するセクションと思われるものを抽出しました(基本的に、私は一般的な更新パターンに従おうとしています)。
var key = function (d) {
return d.index;
}
var filterDistance = function () {
var names = list.selectAll("div")
.data(byDistance.bottom(40), key);
// Update
names.attr("class", "update");
// Add
names.enter()
.append("div")
.attr("class", "enter")
.style("opacity", "0")
.transition()
.duration(500)
.style("opacity", "1")
.text(function (d) {
return displayText(d);
});
// Remove
names.exit()
.transition()
.duration(750)
.style("opacity", "0")
.remove();
};