javascript 使用 d3 对数刻度代替线性刻度

Use d3 log scale instead of linear scale

提问by luisfarzati

I'm trying to do a chart based on http://mbostock.github.com/d3/talk/20111116/bar-hierarchy.html, the only difference being that I'd like to use a log scale for the x-axis.

我正在尝试基于http://mbostock.github.com/d3/talk/20111116/bar-hierarchy.html 制作图表，唯一的区别是我想对 x- 使用对数刻度轴。

Here's my fiddle: http://jsfiddle.net/JhDVC/5/

这是我的小提琴：http: //jsfiddle.net/JhDVC/5/

As you can see, the x-axis is defined at line 4:

如您所见，x 轴定义在第 4 行：

x = d3.scale.linear().range([0, w]),

If I change it for

如果我改变它

x = d3.scale.log().range([0, w]),

Then it doesn't work (nothing is rendered), throwing these error messages:

然后它不起作用（没有呈现任何内容），抛出这些错误消息：

Error: Invalid value for <rect> attribute width="NaN" 

Changing the domain setting from

更改域设置从

x.domain([0, root.value]).nice();

to

到

x.domain([1, root.value]).nice();

shows me the z axis (names) but still no bars or values.

向我显示 z 轴（名称），但仍然没有条形或值。

采纳答案by Lars Kotthoff

There are a few other places where the domain for the scale is set. You need to update those as well.

还有一些其他地方设置了比例的域。你也需要更新这些。

Working jsfiddle here.

在这里工作 jsfiddle 。

And here's some code so that it allows me to post this:

这是一些代码，以便我可以发布此内容：

x.domain([1, root.value]).nice();

回答by btk

Your range includes zero - log(0) is undefined.

您的范围包括零 - log(0) 未定义。