折线图轴的D3图例



我在d3.js的帮助下制作了折线图,其中有轴显示单位为0m, 1m, 2m, 3m等数字。等各种单位。我想在折线图附近显示m = mili, n=nano, B = billion等单位的图例

这是一个带图例的折线图的例子。我不确定你是否遵循同样的过程来绘制你的折线图,因为大多数例子在d3中使用相同的。但是由于你的问题没有任何代码,所以这里有一个例子。下面是如何这样做的代码片段:

var legend = svg.selectAll(".legend")
    .data(cities)
    .enter().append("g")
    .attr("class", "legend")
    .attr("transform", function(d, i) {
      return "translate(0," + i * 20 + ")";
    });
  legend.append("rect")
    .attr("x", width - 18)
    .attr("width", 18)
    .attr("height", 4)
    .style("fill", function(d) {
      return color(d);
    });
  legend.append("text")
    .attr("x", width - 24)
    .attr("y", 6)
    .attr("dy", ".35em")
    .style("text-anchor", "end")
    .text(function(d) {
      return d;
    });

最新更新