[英]D3 bar chart left aligned x-axis
How do I retain the x-axis as 100% of the container width while maintaining left aligned ticks with some padding. 如何在将x轴保留为容器宽度的100%的同时,保持带有一些填充的左对齐刻度线。
this.xAxis = d3.scaleBand()
.range([0, this.barWidth * this.data.length], 1);
If I change the range
to .range([0, this.svgWidth])
, the width is correct but my ticks are evenly spread out which is not my desired outcome. 如果我将
range
更改为.range([0, this.svgWidth])
,则宽度是正确的,但我的刻度线均匀分布,这不是我想要的结果。
The second and third arguments are not accepted anymore in range
when you use a band scale. 使用带刻度时,
range
的第二和第三个参数不再被接受。 Instead, you'll have to use paddingInner
and paddingOuter
. 相反,您必须使用
paddingInner
和paddingOuter
。
So, change your snippet to this: 因此,将您的代码段更改为此:
this.xAxis = d3.scaleBand()
.range([0, this.svgWidth])
.paddingInner(someValue)
.paddingOuter(someValue);
Tweak with someValue
until you find the desired outcome. 调整
someValue
直到找到所需的结果。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.