3

D3を使用してサークルを作成する場合、後の段階で選択できるようにグループを作成することはできますか？たとえば、次のアプローチを使用して円を作成する場合：

var dataset = [   [ 30, 50, 20],
                  [ 100, 50, 20],
                  [ 150, 50, 30]];


//Create SVG element
var svg = d3.select("#chart")
            .append("svg")
            .attr("width",  200)
            .attr("height", 200);

// generate circles 
svg.selectAll("circle")
   .data(dataset)
   .enter()
   .append("circle")
   .attr("cx", function(d){
                return d[0];
                })
   .attr("cy", function(d){
                return d[1];
                })
   .attr("r",  function(d){
                return d[2];
                });

最初の配列要素から作成された円にcircle1、次の2つの円にタグを付けることはできますcircle2か？

4

1 に答える 1

4

絶対-データインデックスに基づいてクラス属性を動的に更新します。

.attr("class", function(d,i) {return i == 0 ? "circle1" : "circle2";});

次に、割り当てられたクラスを使用して要素を選択します。

d3.select(".circle1"); //first circle
d3.selectAll(".circle2"); //second and third circles
于 2012-08-13T03:14:38.413 に答える