Search code examples
javascriptrickshaw

Rickshaw: Graph max y-axis is cutoff

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

Cuttoff Y

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")?

Solution

  • 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.