我想移动图表顶部的图例
我尝试使用 CSS 相对位置,但它似乎不适用于 SVG
请看代码笔
http://codepen.io/7deepakpatil/pen/LkaKoy
var legend = svg.selectAll(".legend")
.data(color.domain())
.enter().append("g")
.attr("class", "legend")
.attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });
上面是生成图例的代码。
是否可以使用 css 或请提供任何 d3 或 JS 方法来解决此问题。
最佳答案
使用 SVG 翻译。与您所拥有的类似,但您需要将其应用于整个图例。所以我附加了一个 'g' 元素,给它一个 id 以便以后轻松选择,并在你向它附加任何内容之前应用了一个翻译,就像这样:
var legend = svg.append('g').attr('id','legendContainer')
.attr("transform", function(d) { return "translate(-200,100)"; }) //this is the translate for the legend
.selectAll(".legend")
.data(color.domain())
.enter().append("g")
.attr("class", "legend")
.attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });
关于javascript - 如何更改散点图中图例的位置 D3.js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39052095/