用於折線圖座標軸的D3圖例

Question

我在d3.js的幫助下製作折線圖，座標軸顯示數字，單位爲0m，1m 2m，3m ..等等。我想在折線圖附近顯示這些單位的圖例，例如m = mili，n = nano，B =十億等。

Answer 1

這是一個帶有圖例的折線圖的example。我不確定是否按照相同的過程繪製線形圖，因爲d3中的大多數示例都使用相同的過程。但是你的問題沒有任何代碼，所以在這裏不用的example anyways.Below是如何做到這一點的片斷：

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; 
    });