D3 SVG内の要素の選択

StackOverflow https://stackoverflow.com/questions/9322729

  •  27-10-2019
  •  | 
  •  

質問

D3でいくつかのグラフを作成しようとしています。これまでのところそれが大好きですが、私は少し立ち往生しています。データポイントを保持するために1つの領域を作成し、軸とラベルを保持する別の領域を作成したいと思います。グラフをより効率的に更新するために、それよりもさらに細かい粒子を獲得すると思います。しかし、私が抱えている問題は、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")

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

役に立ちましたか？

解決

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

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

「G」とは、SVGノードの下ですべてのノード「G」を選択することを意味します。

他のヒント

データコンテナを作成するとき append(), 、選択として変数に保存できます。

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

この方法で行われた場合、D3の選択を再度作成する必要さえありません（同様の方法で行った方法で var graph 質問のコードの最初の行で）、この選択への参照は既にあなたのvarに保存されているため dataContainer.

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top