C3js:如何隐藏y轴上的刻度线?Y轴标签被切断

Dan*_*Apt 4 javascript c3.js

如何隐藏y轴上的刻度?

我目前通过编辑实现它tick.format,正如在这个JSFiddle中可以看到的http://jsfiddle.net/DanielApt/bq17Lp02/1/

我对这个解决方案不满意,因为y轴标签被切断了

屏幕截图显示正在切断y轴标签

那么如何在不切断y轴标签的情况下隐藏刻度?

提前谢谢你的帮助!

Che*_*tan 10

1)尝试将axis.y.tick.count设置为1,这样除了顶部和底部之外不会显示任何刻度.

2)或尝试使用CSS来获取所有中间刻度线,除了顶部和底部之外,如: -

.c3-axis-y .tick {
   display: none;
}
Run Code Online (Sandbox Code Playgroud)

如果轴标签定位是个问题,请尝试将其放置在其他位置,例如: -

axis: {
    x: {
        label: {
            text: 'X Label',
            position: 'outer-center'
            // inner-right : default
            // inner-center
            // inner-left
            // outer-right
            // outer-center
            // outer-left
        }
    },
Run Code Online (Sandbox Code Playgroud)

这是工作代码: - http://jsfiddle.net/chetanbh/24jkmvL5/

参考网址:http://c3js.org/samples/axes_label_position.html


Dan*_*Apt 1

最后我结合了Chetan的答案和一些进一步的工作:

我用以下方法隐藏了蜱虫:

.c3-axis-y .tick {
   display: none;
}
Run Code Online (Sandbox Code Playgroud)

我设置了刻度格式:

axis.y.tick.format = function(){return 'fy'; }
//return characters with both ascenders and descenders
Run Code Online (Sandbox Code Playgroud)

请参阅此 JS Fiddle http://jsfiddle.net/DanielApt/etuwo8mz/1/以了解实际的解决方案。