我用c3.js建立一个图表。 这是我到目前为止:Image1
这是一个带水平条的图表,因此x轴会旋转。我想更改刻度线的位置(刻度线1,刻度线2,刻度线3)以具有以下内容: Image 2
这可能与c3有关吗?我在参考资料上找不到任何东西。
谢谢!
答案 0 :(得分:0)
我也需要这样的功能,所以我提供了以下解决方案:
查找DOM中所有最上面的小节(小节表示为<path>
元素)。 (最顶部,因为如果一个类别中有多个条形,则需要将刻度线放在类别中最高的条形上方。)
对于上一步中找到的每个条形:查看元素的d
属性并从中解析y
坐标。 (d
属性定义了条形图的绘制方式,看起来像M 0,27.4 L503.45454545454544,27.4 L503.45454545454544,67 L0,67 z
,因此在这种情况下,我们对27.4
感兴趣)。将所有坐标存储在数组中。
将容器元素(<g>
)插入DOM中以将所有刻度线保持在一起
为每个刻度线创建<text>
元素,并将坐标数组中的相应y
分配为y属性。