Javascript 将文本向右对齐
我正在尝试用d3js设置一个水平条形图。我想在y轴上添加一个带有文本标签的自定义图例。这些标签大小不同,所以我想把它们对齐到右边 我尝试过以下方法,但不起作用:Javascript 将文本向右对齐,javascript,svg,d3.js,Javascript,Svg,D3.js,我正在尝试用d3js设置一个水平条形图。我想在y轴上添加一个带有文本标签的自定义图例。这些标签大小不同,所以我想把它们对齐到右边 我尝试过以下方法,但不起作用: d3.csv("./top_sources.csv", function(error, data) { data.forEach(function(d) { d.value = +d.value; }); var x = d3.scale.linear() .range([0, 0.8 * width]);
d3.csv("./top_sources.csv", function(error, data) {
data.forEach(function(d) {
d.value = +d.value;
});
var x = d3.scale.linear()
.range([0, 0.8 * width]);
x.domain([0, d3.max(data, function(d) { return d.value; })]);
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis);
svg.selectAll(".bar")
.data(data)
.enter().append("rect")
.attr("class", "bar")
.attr("transform", function(d, i) { var ypos = height - (i-1) * barHeight ; return "translate(" + 0.2 * width + "," + ypos + ")"; })
.attr("width", function(d) { return 0; })
.attr("height", barHeight - 1)
.style("fill", function(d) { return color(d.name); });
svg.selectAll(".bar")
.data(data)
.transition()
.duration(1000)
.attr("width", function(d) { return x(d.value); });
svg.selectAll(".legend")
.data(data)
.enter()
.append("text")
.attr("class", ".legend")
.attr("width", function(d) { return d.key.length; })
.attr("x", function(d) { return 100 - d.key.length; })
.attr("y", barHeight / 2)
.attr("transform", function(d, i) { var ypos = height - (i-1) * barHeight ; return "translate(0," + ypos + ")"; })
.text(function(d) { return d.key; });
});
我想我必须得到标签长度并将其减去一个自定义值(我在这里使用100),但我无法正确地做到这一点。
我怎样才能做到这一点
谢谢试试
。风格(“文本锚定”,“结束”)
很有效,谢谢