Y axis label not displaying large numbers - Multi-Bar Chart

Question

In my Multi-Bar Chart, I need to show larger numbers on the Y axis labels. Currently it's not showing more than seven characters:

How can I do it?

Inappropriate

You need to allocate more space to the labels by increasing the width of the SVG or something like that. – Frippery

I already tried this, but doesn't work. The label continue cutting... What I need is to increase label space. – Inappropriate

That's what I'm saying. Without your code we can't give you more specific advice. – Frippery

What kind of code you want? I'm using nvd3, the default implementation. I need to change the default space for labels on y axis. – Inappropriate

Right, so try something like d3.select(".nv-multiBarWithLegend").attr("transform", "translate(100,30)"). – Frippery

Answer 1

Set chart.margin().left = 120 This will give you plenty of space to display 10,000,000.

nv.addGraph(function() {
  var chart = nv.models.discreteBarChart()
      .x(function(d) { return d.label })
      .y(function(d) { return d.value })
      .staggerLabels(true)
      .tooltips(false)
      .showValues(true)

  chart.forceY([10000000]);
  chart.margin().left = 120
  d3.select('#chart svg')
      .datum(data)
    .transition().duration(500)
      .call(chart);


  nv.utils.windowResize(chart.update);

  return chart;
});

JSFiddle: http://jsfiddle.net/marrok/Ev3UN/1/

Councilor