0

この質問を投稿したときから少し編集しました。ここに新しいコードがあります: ここに私のコードがあります:

        var elementTags = ["Google", 4, "Wikipedia", "Yahoo!", "Cindy"];
        var _s32 = (Math.sqrt(3)/2);
        var A = 75;
        var _counter = 0;
        var xDiff;
        var yDiff;
        var pointData = [[A+xDiff, 0+yDiff], [A/2+xDiff, (A*_s32)+yDiff], [-A/2+xDiff, (A*_s32)+yDiff], [-A+xDiff, 0+yDiff],
        [-A/2+xDiff, -(A*_s32)+yDiff], [A/2+xDiff, -(A*_s32)+yDiff], [A+xDiff, 0+yDiff]];
        var svgContainer = d3.select("body") //create container
                .append("svg")
                .attr("width", 1000)
                .attr("height", 1000);

        var enterElements = svgContainer.selectAll("path.area") //draw elements
                .data([pointData]).enter().append("path")
                .style("fill", "#ff0000")
                .attr("d", d3.svg.area());

私がやりたいことは、elementTags値ごとに新しい六角形を作成することです。新しい六角形はそれぞれ、ランダム化された xDiff と yDiff を持つ必要があり、そのたびに の値が 1 ずつ増加する必要があります_counter

4

2 に答える 2

0

この質問で説明されている同様の状況がありました。ここにあるコード例をまとめました: http://bl.ocks.org/explunit/4659227

重要なアイデアは、各データ ポイントの追加中にパス生成関数を呼び出すことができるということです。

svg.selectAll("path")
  .data(nodes).enter().append("svg:path")
  .attr("d", function(d) { return flow_shapes[d.NodeType](d.height, d.width);})

コードから判断するのは難しいですが、データを作成してから D3 にすべてのメモを 1 つのステートメントに追加させるのではなく、ループで .append を呼び出そうとしているようです。

完全なコードを JSFiddle に入れると、あなたが何をしようとしているのかをすべて確認できるようになると役立つ場合があります。

于 2013-05-20T18:09:27.660 に答える