Search code examples
d3.jsd3plus

D3 scale how to put only the minimum and the max number on the scale


Creating the scale:

headers.forEach(function(d) {
            // Coerce values to numbers.
            jsonObj.forEach(function(p) {
                y[d] = d3.scale.linear().domain(
                        d3.extent(jsonObj, function(p) {
                            return +p[d] || 0;
                        })).range([ h, 0 ]);
                y[d].brush = d3.svg.brush().y(y[d]).on("brush", brush);
            });
        }); 



g.append("svg:g").attr("class", "axis").each(function(d) {
            d3.select(this).call(axis.scale(y[d]));

the Scale is comming [0.0,0.1,0.2,...,1.0]

I want something like this [0,1].

It's possible? How can I do this?


Solution

  • You should look into axis.ticks(). I assume axis.ticks(2) would give you just the min and max axis values.

    Another option that would probably work if you know the min/max values in advance, or want to calculate them, is axis.ticksValues().

    More info on both, plus lots of other details about the axis, can be found at https://github.com/mbostock/d3/wiki/SVG-Axes#ticks