How to make the scale to round to the nearest multiple of #?

Question

x.scale = d3.time.scale().domain(x.extent).range([0, dimensions.graph.width]);

This code uses x.extent ([Wed Aug 01 2012 00:00:00 GMT+0300 (EEST), Tue Aug 07 2012 00:00:00 GMT+0300 (EEST)]) and graph width (1000) to generate x value scale. However, I need this value to be rounded to the nearest multiple of 25 (Math.round(x/25)*25).

By doing this I want to achieve exact width ticks that are now defined as:

x.axis = d3.svg.axis()
    .ticks(d3.time.days, 1)
    .tickSize(10, 5, 0)
    .scale(x.scale);

How to extend x.scale to round to the nearest multiple of 25?

Answer 1

The correct answer is interpolateRound, from the docs

Returns an interpolator between the two numbers a and b; the interpolator is similar to interpolateNumber, except it will round the resulting value to the nearest integer.

var xScale = d3.scaleLinear()
    .domain([0, 100])
    .range([0, width])
    .interpolate(d3.interpolateRound); // <-- round interpolation