在折线图上隐藏 D3 中的刻度标签

Hide Tick Labels in D3 on Line Graph

本文关键字:标签 D3 折线图 隐藏      更新时间:2023-09-26

我是 D3 的新手,刚刚对使用 D3 制作的折线图上的刻度标签有一个快速的问题。我正在使用 d3.svg.axis.scale().tickSize().tickSubdivide() 来生成我的刻度线。

有没有办法隐藏它们或更改它们的值?例如,我有一个折线图,其中刻度标签是间隔(1、2、3 等),我想将它们更改为字符串,例如("Jan"、"Feb"、"Mar"、"Apr"等)。这可能吗?

谢谢!

您可以像这样隐藏刻度格式:

myGraph.yAxis.tickFormat(function (d) { return ''; });

是的,可以为您的即时报价生成不同的格式。您可以在此处找到一些详细信息: https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickFormat .遗憾的是,目前并非所有格式都有文档记录,因此您可能需要查看该方法的 d3 代码。如果您同时拥有 xAxis 和 yAxis,则可以执行以下操作:

myGraph.yAxis.tickFormat(d3.format(',.2%'));

还可以看看Bob Monteverde的图表库:https://github.com/novus/nvd3(特别是在sources文件夹中的轴组件中),如果你想看到很多与轴组件和轴刻度格式相关的技巧。

另一方面,如果您不希望显示刻度,那么我想您可以创建一个没有刻度的轴组件(我没有尝试过这个,很难),但是当您有自定义格式化程序并且您几乎可以用刻度做任何您想做的事情时,我认为这样做没有意义。

此致敬意!