多圆环图d3传说不起作用

时间:2013-12-20 18:27:09

标签: d3.js

我是d3新手。我试图创建一个多方图表。 但我没有得到传奇专栏。我在这里添加了我的代码

http://jsfiddle.net/YsvT8/

我尝试添加此代码

var legend = d3.select("body").append("svg")
      .attr("class", "legend")
      .attr("width", radius * 2)
      .attr("height", radius * 2)
    .selectAll("g")
      .data(color.domain().slice().reverse())
    .enter().append("g")
      .attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });

  legend.append("rect")
      .attr("width", 18)
      .attr("height", 18)
      .style("fill", color);

  legend.append("text")
      .attr("x", 24)
      .attr("y", 9)
      .attr("dy", ".35em")
      .text(function(d) { return d; });

但是我的页面没有加载。 我无法弄清楚我需要做些什么来改变页面左侧的图例。

1 个答案:

答案 0 :(得分:0)

试试这段代码。它会为您提供所需的输出。

 var legend = d3.select("body").append("svg")
        .attr("class", "legend")
        .attr("width", radius * 2)
        .attr("height", radius * 2)
        .selectAll("g")
        .data(pairs) //Changed this line from your code
        .enter().append("g")
        .attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });

        legend.append("rect")
          .attr("width", 18)
          .attr("height", 18)
          .style("fill", color);

        legend.append("text")
          .attr("x", 24)
          .attr("y", 9)
          .attr("dy", ".35em")
          .text(function(d) { return d.key; });//Changed this line from your code