svg - 如何在D3轴刻度中获取数字值而不是对数值？

Question

我尝试了以下代码，

d3.scale.log().domain([1,4]).range([h, 0]);

在轴中，我在轴值中得到的值为 1e + 0、2e + 0、3e + 0、4e + 0 。但我需要对数值，例如10、100、1000、10000 ..etc...。

Answer 1

结合使用log.scale的tickFormat和轴tickFormat函数。

例如。设置1-> 10000对数刻度:

var s = d3.scale.log().domain([1, 10000]).range([1000, 0])

然后，设置轴:

var axis = d3.svg.axis().scale(s).tickFormat(function (d) {
        return s.tickFormat(4,d3.format(",d"))(d)
})

例子

http://jsfiddle.net/2hvxc/

我们想要4个刻度线-每10的幂次方一个-并用逗号格式化为数字。

在此处了解有关格式化的更多信息:
https://github.com/mbostock/d3/wiki/Formatting

在此处了解更多关于对数刻度的信息:
https://github.com/mbostock/d3/wiki/Quantitative-Scales#wiki-log

和轴:
https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickSize