Decimal value on d3.js y axis

6
votes

enter image description here

I am having an issue with adjusting scale on y-axis for a d3.js visualization that I am working on. On the scale, it is showing the values as 1.0,2.0 1Y-axis for d3

I want to change the value to 0.3,0.4,0.5,0.6 instead 3,4,5,6.

My code is attached below :

  var y = d3.scale.linear()
  .domain([0, d3.max(stateById.values(), function(d) { return d.total; })])
  .rangeRound([height, 0])
  .nice();

var yAxis = d3.svg.axis() .scale(y) .orient("left") .tickFormat(d3.format(".1f"));

please advise on what change I should make in the line above. Thanks.

1
javascriptd3.jssvg

1 Answers

8
votes

Essentially what you need to do is change the tickFormat function to divide the datum by ten. It may also be good practice to store the d3.format(".1f") in an external variable and use that instead.

.tickFormat(function (d){
    return d3.format(".1f")(d/10);
})