p:lineChart does not plot with Date axis and tick interval

Question

I see some other posts on this argument (see here, here and here), but I cannot get my code to work.

Managed bean:

public void loadGraphic()
{
  linearModel = new CartesianChartModel();
  LineChartSeries series = new LineChartSeries();

  Calendar cal = Calendar.getInstance();
  cal.set(Calendar.YEAR, 2013);
  cal.set(Calendar.MONTH, 10);
  cal.set(Calendar.DAY_OF_MONTH, 19);
  cal.set(Calendar.HOUR_OF_DAY, 2);
  cal.set(Calendar.MINUTE, 33);
  cal.set(Calendar.SECOND, 47);

  minX = new Timestamp(cal.getTimeInMillis());
  minY = new Double("1.44");
  maxY = new Double("1.829");

  measures = new ArrayList<TriggerGraphicalData>();
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.72")));
  cal.set(Calendar.HOUR_OF_DAY, 2);
  cal.set(Calendar.MINUTE, 48);
  cal.set(Calendar.SECOND, 59);
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.735")));
  cal.set(Calendar.HOUR_OF_DAY, 3);
  cal.set(Calendar.MINUTE, 11);
  cal.set(Calendar.SECOND, 02);
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.44")));
  cal.set(Calendar.HOUR_OF_DAY, 3);
  cal.set(Calendar.MINUTE, 12);
  cal.set(Calendar.SECOND, 04);
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.69")));
  cal.set(Calendar.HOUR_OF_DAY, 5);
  cal.set(Calendar.MINUTE, 30);
  cal.set(Calendar.SECOND, 00);
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.803")));
  cal.set(Calendar.HOUR_OF_DAY, 9);
  cal.set(Calendar.MINUTE, 00);
  cal.set(Calendar.SECOND, 25);
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.829")));
  cal.set(Calendar.HOUR_OF_DAY, 9);
  cal.set(Calendar.MINUTE, 00);
  cal.set(Calendar.SECOND, 27);
  measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()), new Double("1.729")));

  int seconds = 28;
  for (int i = 0; i < 30; i++, seconds++)
  {
    cal.set(Calendar.SECOND, seconds);
    measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()),
      new Double("1.75")));
  }

  cal.set(Calendar.MINUTE, 1);
  seconds = 0;
  for (int i = 0; i < 60; i++, seconds++)
  {
    cal.set(Calendar.SECOND, seconds);
    measures.add(new TriggerGraphicalData(new Timestamp(cal.getTimeInMillis()),
      new Double("1.69")));
  }

  for (TriggerGraphicalData measure : measures)
  {
    // series.set(TimeUtil.getSecondInDayRelative(measure.getxValue(), minX),
    // measure.getyValue());
    series.set(measure.getxValue(), measure.getyValue());
  }

  maxX = new Timestamp(cal.getTimeInMillis());

  linearModel.addSeries(series);
}

XHTML page:

<p:lineChart value="#{monitoringData.linearModel}" 
  style="height: 400px; width: 99%" legendPosition="ne" 
  zoom="true" animate="true" yaxisAngle="45" 
  seriesColors="3399FF, FF9900, 3399FF, FF9900, 3399FF, FF9900" 
  rendered="#{not empty monitoringData.measures}" extender="chartExtender">
  <f:convertDateTime pattern="dd-MM-yyyy HH:mm:ss" />
  <script type="text/javascript" src="#{request.contextPath}/js/jqplot.canvasAxisTickRenderer.js" />
  <script type="text/javascript" src="#{request.contextPath}/js/jqplot.categoryAxisRenderer.js" />
  <script type="text/javascript" src="#{request.contextPath}/js/jqplot.dateAxisRenderer.js" />
  <script type="text/javascript">
    function chartExtender() {
      console.log(this.cfg);
      var millis = this.cfg.categories;
      var minX = millis[0];
      var maxX = millis[millis.length - 1];
      console.log(minX);
      console.log(maxX);

      this.cfg.axes = {
        xaxis: {
          renderer: $.jqplot.DateAxisRenderer,
          min: minX,
          max: maxX,
          //autoscale: true,
          tickRenderer: $.jqplot.CanvasAxisTickRenderer,
          tickOptions: { 
            formatString: '%H:%M:%S', 
            tickInterval: '3600000',
            angle: 60
          }
        },
        yaxis: {
          renderer: $.jqplot.LinearAxisRenderer,
          tickRenderer:$.jqplot.CanvasAxisTickRenderer,
          tickOptions: {
            formatString: '%.4f',
            angle: 45
          }
        }
      }
      //this.cfg.axes.xaxis.ticks = this.cfg.categories;
    }
  </script>
</p:lineChart>

1) With no extender, the plot is correctly drawed, but the x axis ticks overlap each other (this is an example, I can have charts with more than 200 points).

2) Using an extender without specify the min/max values, the plot is correctly drawed, but the ticks on the x axis disappear (there are only two identical values at the beginning and at the end of the x axis).

3) Like case 2, plus min/max values (specified via javascript within the extender), the ticks are correctly drawed (and can be zoomed also), but no plot renders.

4) Like case 3, with the line "this.cfg.axes.xaxis.ticks = this.cfg.categories" decommented, it breaks the x axis ticks and do not render the plot.

Thanks in advance.