continuous.interpolate()

continuous.interpolate(interpolate)

If interpolate is specified, sets the scale’s range interpolator factory. This interpolator factory is used to create interpolators for each adjacent pair of values from the range; these interpolators then map a normalized domain parameter t in [0, 1] to the corresponding value in the range. If factory is not specified, returns the scale’s current interpolator factory, which defaults to interpolate. See d3-interpolate for more interpolators.

For example, consider a diverging color scale with three colors in the range:

var color = d3.scaleLinear()
    .domain([-100, 0, +100])
    .range(["red", "white", "green"]);

Two interpolators are created internally by the scale, equivalent to:

var i0 = d3.interpolate("red", "white"),
    i1 = d3.interpolate("white", "green");

A common reason to specify a custom interpolator is to change the color space of interpolation. For example, to use HCL:

var color = d3.scaleLinear()
    .domain([10, 100])
    .range(["brown", "steelblue"])
    .interpolate(d3.interpolateHcl);

Or for Cubehelix with a custom gamma:

var color = d3.scaleLinear()
    .domain([10, 100])
    .range(["brown", "steelblue"])
    .interpolate(d3.interpolateCubehelix.gamma(3));

Note: the default interpolator may reuse return values. For example, if the range values are objects, then the value interpolator always returns the same object, modifying it in-place. If the scale is used to set an attribute or style, this is typically acceptable (and desirable for performance); however, if you need to store the scale’s return value, you must specify your own interpolator or make a copy as appropriate.

doc_D3_Js
2016-11-24 10:25:39
Comments
Leave a Comment

Please login to continue.