Solving jQplot line graphs not drawing to edge of div when using DateAxisRenderer

Thursday, January 16th 2014

This one took me almost a week of messing with and googling. Seriously, this one sucked. If you’re using a jQplot and and trying to draw an line graph using the DateAxisRenderer with a lot of data points on the xaxis you might run into this issue:

Thankfully this is a pretty easy fix, once you know how. All you have to do is specify a min and max on your xaxis with the first data point in the set (min) and the last data point in your set (max). Something like:

xaxis: {
  pad: 0,
  padMin: 0,
  padMax: 0,
  min: "2013-11-07", //First date in the graph
  max: "2014-01-05", //Last date in the graph
  renderer: $.jqplot.DateAxisRenderer,
  tickOptions:{
    formatString:'%b %#d'
  }
}

And that should fix it!

Whoop!