SVG グループ オブジェクトを作成し、HTML テキストを含む四角形とforeignObject-SVG 要素を追加しました。グループの「mousedown」イベントで呼び出されるアニメーション関数を定義しました。アニメーション関数は、id で指定された要素でトランジションを行います。
これは機能しない部分です。私が使用する場合：
d3.select("#group").transition()
グループの x 座標が変化していることがわかりますが、グループ内の要素は移動しません。#Id をforeignObjectまたは四角形のIdに設定すると、それらは移動します。したがって、「グループのすべてのサブ要素」で遷移を呼び出す必要があると思いますが、その方法がわかりません。
ここに私が準備した例があります: http://jsfiddle.net/YxfMH/
また、「グループ全体」をマウスでドラッグするにはどうすればよいのでしょうか。