D3 SVG内の要素を選択

Question

D3でグラフを作成しようとしています。これまでのところ大好きですが、ちょっと立ち往生しています。 データポイントを保持する領域と、軸とラベルを保持する領域を作成したいとします。 グラフをより効率的に更新するためには、それより細分化されていると思います。しかし、私が抱えている問題は、SVG内のサブ要素を選択することができないということです。ここで

は私が持っているものです。

var graph = d3.select('#Graph svg') 
if (graph[0][0] == null){ 
    graph = d3.select('#Graph') 
     .append("svg:svg") 
     .attr("width",width) 
     .attr("height",height) 
     .attr("class","chart"); 
} 

graph.append("svg:g") 
    .attr("id","data") 

は今、私はそのデータコンテナを選択するための方法を発見していません。私は試しました

d3.select("#Graph svg data") 

運がありません。何か案は？

Answer 1

このコードを試してみましょう。

d3.select("#Graph svg").selectAll("g") 

"g"は、svgノードの下にあるすべてのノード "g"を選択することを意味します。

Answer 2

appendを使用してデータコンテナを作成する場合、その選択を変数に保存できます。

それはすでにあなたのVAR dataContainerに格納されているため、あなたは（あなたが第一ライン上のグラフで行った同様の方法で）選択を行う必要はありません。このようにすれば

var dataContainer = graph.append("svg:g") 
    .attr("id","data"); 

。