0

I wanna show 6 different Charts on one page. I .load 6 different PHP files for that (and reload them every 15min). In my code its all seperated, witch I thin its nit very clean & performant. Is that still ok to do that this way or any better suggestions?

<script type="text/javascript"  />
$(document).ready(function(){
  get_main();
  get_chart_1();
  get_chart_2();
  get_chart_3();
  get_chart_4();
  get_chart_5();
});

function get_main(){
    $('#chart_main').load('chart_data/day_main.php', function(){
       setTimeout(get_main, 900000);
    });
}
function get_chart_1(){
    $('#chart_1').load('chart_data/day_chart_1.php', function(){
       setTimeout(get_chart_1, 900000);
    });
}
function get_chart_2(){
    $('#chart_2').load('chart_data/day_chart_2.php', function(){
       setTimeout(get_chart_2, 900000);
    });
}
function get_chart_3(){
    $('#chart_3').load('chart_data/day_chart_3.php', function(){
       setTimeout(get_chart_3, 900000);
    });
}
function get_chart_4(){
    $('#chart_4').load('chart_data/day_chart_4.php', function(){
       setTimeout(get_chart_4, 900000);
    });
}
function get_chart_5(){
    $('#chart_5').load('chart_data/day_chart_5.php', function(){
       setTimeout(get_chart_5, 900000);
    });
}

Neil Fender
  • 75
  • 1
  • 10
  • 1
    If your code is working then it would be better to ask on http://codereview.stackexchange.com/ – jcubic Feb 03 '16 at 13:35
  • 1
    There is no need to make 3 different http requests / ajax calls to get information from the same server. You should make one ajax call and combine the scripts on the server side or have one script that includes the other scripts. Then you can combine the output data in an array or object and json_encode() it to send it back to the browser. There you can get the different parts and put them in different html elements as desired. You might need to move to a bit more complete method like $.ajax() instead of just using .load() though. – Domain Feb 03 '16 at 13:39
  • You can use $.when() and then() functions in jqeury to load multiple json, and then init chart in callback. – Sebastian Bochan Feb 03 '16 at 14:42

1 Answers1

0

I would make only one function, which goes over array of meta-data, loads all the charts and calls itself periodically. E.g.

var Charts = ['chart_main;day_main', 'chart_2;day_chart_2', ....];
function loadCharts(){
    for (var i in Charts){
        var eleFil = Charts[i].split(';'); 
        $('#'+eleFil[0]).load('chart_data/'+eleFil[1]+'.php');
    }
    setTimeout(loadCharts, 900000);
}
loadCharts();
Daniel
  • 1,364
  • 1
  • 11
  • 18
  • Object will be better then semicolon separated string. Like `{selector: 'chart_main', file: 'day_main'}` or array `['chart_main', 'day_main']` – jcubic Feb 03 '16 at 15:53
  • Changed my structure, still the same question how to perform in an logic way. http://stackoverflow.com/questions/35218910/highcharts-load-and-refresh-csv – Neil Fender Feb 05 '16 at 07:54