Rickshaw: Graph max y-axis is cutoff

Question

I'm trying to use Rickshaw to display data in our JS app, but the y-axis is sometimes cutoff:

I have tried several variants of "display:visible", but nothing seems to work. Do you know how to fix this? (i.e. show the full "$100")?

Answer 1

You can add padding to the Rickshaw.Graph object itself when creating/instantiating it:

var graph = new Rickshaw.Graph( {
  element: document.getElementById("chart"),
  renderer: 'line',
  stroke: true,
  series: seriesVar,
  padding: {top: 0.02, left: 0.02, right: 0.02, bottom: 0.02}
} );

See Rickshaw homepage for padding explanation.