javascript 在折线图上隐藏 D3 中的刻度标签
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10918901/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hide Tick Labels in D3 on Line Graph
提问by Mars J
I am new to D3 and just had a quick question about tick labels on line graphs made with D3. I am using d3.svg.axis.scale().tickSize().tickSubdivide() to generate my tick marks.
我是 D3 的新手,刚刚有一个关于用 D3 制作的折线图上的刻度标签的快速问题。我正在使用 d3.svg.axis.scale().tickSize().tickSubdivide() 来生成我的刻度线。
Is there a way to hide them or to change their value? For example, I have a line graph where the tick labels are the intervals (1, 2, 3, etc) and I'd like to change them to strings like ('Jan', 'Feb', 'Mar', 'Apr', etc). Is that possible?
有没有办法隐藏它们或改变它们的价值?例如,我有一个折线图,其中刻度标签是间隔(1、2、3 等),我想将它们更改为字符串,例如 ('Jan', 'Feb', 'Mar', 'Apr ', 等等)。那可能吗?
Thanks!
谢谢!
采纳答案by paxRoman
Yes, it is possible to generate different formats for your ticks. You can find some details here: https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickFormat. Unfortunately not all formats are currently documented, so you may want to take a look at the d3 code for that method. If you have both xAxis and yAxis you can do something like:
是的,可以为您的报价生成不同的格式。您可以在此处找到一些详细信息:https: //github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickFormat。不幸的是,目前并非所有格式都被记录在案,因此您可能需要查看该方法的 d3 代码。如果您同时拥有 xAxis 和 yAxis,您可以执行以下操作:
myGraph.yAxis.tickFormat(d3.format(',.2%'));
Also have a look at Bob Monteverde's charting library: https://github.com/novus/nvd3(especially in the sources folder, at the axis components), if you want to see lots of tricks related to axis components and axis tick formatting.
也可以看看 Bob Monteverde 的图表库:https: //github.com/novus/nvd3(特别是在源文件夹中,在轴组件中),如果你想看到很多与轴组件和轴刻度格式相关的技巧.
If on the other hand you don't want the ticks displayed, then I guess you can create an axis component without ticks (I did not try this, tough), but I don't see the point in doing that when you have custom formatters and you can do virtually anything you want with the ticks.
另一方面,如果您不希望显示刻度,那么我想您可以创建一个没有刻度的轴组件(我没有尝试过,很难),但是当您有自定义时,我不认为这样做有什么意义格式化程序,你几乎可以用刻度做任何你想做的事情。
Best regards!
最好的祝福!
回答by Thomas Coats
You can hide the tick format like so:
您可以像这样隐藏刻度格式:
myGraph.yAxis.tickFormat(function (d) { return ''; });