PVPC trend graph in visu

[admin]

What does you user.lp return? It must be a valid JSON array with up to 24 numbers.
I've modified the example to handle resizing when plan changes. It fixed the issue when chart is not rendered correctly on a plan that is not visible when rendering happens.

Code:

$(function() {
  $('<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chartist/0.11.4/chartist.min.css" type="text/css">').appendTo('head');

  $.getScript('https://cdnjs.cloudflare.com/ajax/libs/chartist/0.11.4/chartist.min.js', function() {
    var el = $('<div></div>').css({
      position: 'absolute',
      width: '600px',
      height: '300px',
      left: '10px',
      top: '50px',
      zIndex: 999
    }).appendTo('#plan-8');

    $.getJSON('/user/data.lp', function(data) {
      var labels = [];
      
      for (var i = 0; i < 24; i++) {
        var label = '';
        
        if ((i % 3) == 0) {
          label = i + ':00';
        }
        
        labels.push(label);
      }
      
      var chart = new Chartist.Line(
        el.get(0),
        {
          labels: labels,
          series: [ data ]
        },
        {
          low: 0,
          showArea: true
        }  
      );
      
      $('body').on('showplan', function() {
        chart.resizeListener();
      });
    });
  });
});