D3JS中的自定义轴功能

Question

I'm using D3JS and I want an axis in x with this kind of values : 125, 250, 500, 1000 ... until 8000. So multiply by 2 my values each time.

So I tried a Quantize Scales but axis do not support it.

How can I do this ? Can I do a custom mathematical function like y = mx + b (where m = 2 in my case and b = 0) and use it in axis?

Here you can see my code

Podelo

Answer 1

The linear scale is pretty flexible if you mass in multiple values for the range and domain to create a polylinear scale:

tickWidth = (ChartWidth - padding)/7
xScale = d3.scale.linear()
           .domain([0, 125, 250, 500, 1000, 2000, 4000, 8000])
           .range(d3.range(8).map(function(d){ return d*tickWidth; }));

http://jsfiddle.net/h2juD/6/