如何使用图表js修改水平条形图

Question

请看我突出显示的行。

1. 如何在Y轴上添加标签
2. 如何将0位置垂直线作为虚线。
3. 如何在照片中提到圆角。

我需要修改图表js条形图。

enter image description here

但修改它非常复杂。如果有人对图表js有所了解，我们将非常感谢您的帮助。

Answer 1

搞清楚这一点需要查看chart.js配置here。

1. 要在Y轴的另一条线上添加标签，您的标签需要以下结构labels: [["Dept1", 81], ["Dept2", 82], ["Dept3", 83]]。
2. Chart.js 2.0默认情况下可以处理负值，因此您需要做的就是传入各自的数据点。像这样的东西应该没问题：data: [12, -19, 5],
3. 圆角问题有点棘手。我使用了一个链接here的外部库。有一些画布渲染技巧正在进行中。一定要为他的回购明星给予作者信用！

结果小提琴：https://codepen.io/anon/pen/gKRQZG?editors=1000