[英]D3js X axis label style justify to left
Is there a way to justify the text in the X axis to the left?有没有办法让 X 轴上的文本向左对齐? I've tried with
.attr("text-anchor", "middle")
.attr("text-anchor", "end")
.attr("text-anchor", "start")
but nothing works, I also tried with css but nothing works.我试过
.attr("text-anchor", "middle")
.attr("text-anchor", "end")
.attr("text-anchor", "start")
但没有任何效果,我也尝试使用 css 但没有任何效果。
this is how my X axis looks like这就是我的 X 轴的样子
and this is the part of the code that ads the x labels这是广告 x 标签的代码部分
// Add X axis
var x = d3.scaleBand()
.domain(groups)
.range([0, width])
.padding([0.5]);
svg.append("g")
.attr("transform", "translate(0," + height + ")")
.call(d3.axisBottom(x))
.selectAll("text")
.attr("text-anchor", "middle")
.attr("font-size", "55px")
.attr("y", "-7")
.attr("x", "-45")
.attr("transform", "rotate(-90)");
I don't know if I understood your question properly but it seems you want the x axis text closest to the axis itself am I right?我不知道我是否正确理解了您的问题,但似乎您希望 x 轴文本最接近轴本身,对吗? If that's the question I think your problem is related to the
text-anchor
atribute.如果这是我认为您的问题与
text-anchor
属性有关的问题。 I would sugest writing .style
instead of .attr
so the code would look something like this:我建议编写
.style
而不是.attr
,这样代码看起来像这样:
.style("text-anchor", "end")
I'll provide this link for you to read so you can understand a bit more how to fix the axis problem and I hope it helps.我将提供此链接供您阅读,以便您可以更多地了解如何解决轴问题,希望对您有所帮助。
If it doesn't work, please let me know.如果它不起作用,请告诉我。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.