Don't show negative sign d3 axis labels

Question

I have a scale in which I don't want the negative signs to appear before the numbers - how can this be done in the d3 formatter? The scale is built as follows:

var formater = d3.format("0");

self.x = d3.scale.linear().domain([self.xmin, self.xmax]).range([0, self.settings.width])

    self.axis = d3.svg.axis()
        .scale(self.x)
        .orient("bottom")
        .tickFormat(formater);

    self.axisLabels = self.svg.append("g")
                    .attr("class", "axis")
                    .attr("id", "axis")
                    .call(self.axis)

I see an option to add a "+" sign but not remove a "-" sign https://github.com/mbostock/d3/wiki/Formatting#wiki-d3_format

Also, is it possible to remove one label? I'm labeling from -5 to 5 on the scale, and don't want the negative signs to appear, and I don't want to label 0. Thanks.

Answer 1

You are using a formatter already and you do not need to rely on D3 to remove the '-' sign, you can do it yourself:

var formatter = d3.format("0");

// ...

self.axis = d3.svg.axis()
    .scale(self.x)
    .orient("bottom")
    .tickFormat(function (d) { 
         if (d === 0) return ''; // No label for '0'
         else if (d < 0) d = -d; // No nagative labels
         return formatter(d);
    });