使用Chart.js v4.3.0,我尝试在垂直条形图上左对齐x轴标签。默认情况下,它们是居中的,我阅读的the docs表明,将其添加到图表的options
中就可以做到这一点:
ticks: {
align: 'start',
},
奇怪的是,这将标签稍微向右移动,但仍然没有对齐。
CodePen问题演示:https://codepen.io/ChrisBup/pen/qBQWqPw
预期行为:
我设置了labelOffset
来获取屏幕截图,但因为它只需要一些像素,所以它不是一个响应式的解决方案。
额外上下文:
Chart.js版本:4.3.0
浏览器:Chrome Version 113.0.5672.126(Official Build)(arm64)
1条答案
按热度按时间yuvru6vn1#
我认为对齐选项按设计工作。应用选项的位置与“刻度”的中间有关。它作为Context2D https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/textAlign的textAlign属性实现
您可以通过自定义插件更改刻度的位置:
你应该添加插件
然后将
align
选项设置为“X刻度”到'start'
。Codepen:https://codepen.io/stockinail/pen/qBQWxZQ