Graphics value only appears when page resolution is changed

1

I have 2 JavaScript charts that are receiving values through a PHP file. However these values only appear in the graphic when the resolution of the web page for some reason is changed. This is the JavaScript code I have:

demo = { 
  initDashboardPageCharts: function() {
    var dataSales = {
      labels: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
      series: []
    };

    var optionsSales = {
      lineSmooth: false,
      low: 0,
      high: 100,
      showArea: true,
      height: "245px",
      axisX: {
        showGrid: false,
      },
      lineSmooth: Chartist.Interpolation.simple({
        divisor: 3
      }),
      showLine: false,
      showPoint: false,
      fullWidth: false
    };

    var responsiveSales = [
      ['screen and (max-width: 640px)', {
        axisX: {
          labelInterpolationFnc: function(value) {
            return value[0];
          }
        }
      }]
    ];

    var chartHours = Chartist.Line('#chartHours', dataSales, optionsSales, responsiveSales);
  }
}

If you want to see for yourself, you can see here . How can I resolve this so that the values always appear?

    
asked by anonymous 07.06.2018 / 16:16

1 answer

0

After:

var chartHours = Chartist.Line('#chartHours', dataSales, optionsSales, responsiveSales);

Add:

setTimeout(function() { chartHours.update(); }, 0);

Related problem: link

    
08.06.2018 / 02:01