GRAPHS
<!-- HTML --> <div id="flot-sales" class="flot-chart height-300"><!-- FLOT CONTAINER --></div> <!-- JAVASCRIPT --> For javascript code example, see assets/js/view/demo.graphs.flot.js <!-- JS LOAD --> loadScript(plugin_path + "chart.flot/jquery.flot.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.resize.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.time.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.fillbetween.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.orderBars.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.pie.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.tooltip.min.js", function(){ // demo js script - or add js code directly here! loadScript("assets/js/view/demo.graphs.flot.js"); }); }); }); }); }); }); });
Bar Chart
<!-- HTML --> <div id="flot-bar-horizontal" class="flot-chart height-300"><!-- FLOT CONTAINER --></div> <!-- JAVASCRIPT --> For javascript code example, see assets/js/view/demo.graphs.flot.js <!-- JS LOAD --> loadScript(plugin_path + "chart.flot/jquery.flot.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.resize.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.time.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.fillbetween.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.orderBars.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.pie.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.tooltip.min.js", function(){ // demo js script - or add js code directly here! loadScript("assets/js/view/demo.graphs.flot.js"); }); }); }); }); }); }); });
Stats Chart
<!-- HTML --> <div id="flot-stats" class="flot-chart height-300"><!-- FLOT CONTAINER --></div> <!-- JAVASCRIPT --> For javascript code example, see assets/js/view/demo.graphs.flot.js <!-- JS LOAD --> loadScript(plugin_path + "chart.flot/jquery.flot.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.resize.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.time.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.fillbetween.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.orderBars.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.pie.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.tooltip.min.js", function(){ // demo js script - or add js code directly here! loadScript("assets/js/view/demo.graphs.flot.js"); }); }); }); }); }); }); });
Bar Chart
<!-- HTML --> <div id="flot-bar" class="flot-chart height-300"><!-- FLOT CONTAINER --></div> <!-- JAVASCRIPT --> For javascript code example, see assets/js/view/demo.graphs.flot.js <!-- JS LOAD --> loadScript(plugin_path + "chart.flot/jquery.flot.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.resize.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.time.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.fillbetween.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.orderBars.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.pie.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.tooltip.min.js", function(){ // demo js script - or add js code directly here! loadScript("assets/js/view/demo.graphs.flot.js"); }); }); }); }); }); }); });
Pie Chart
<!-- HTML --> <div id="flot-pie" class="flot-chart height-300"><!-- FLOT CONTAINER --></div> <!-- JAVASCRIPT --> For javascript code example, see assets/js/view/demo.graphs.flot.js <!-- JS LOAD --> loadScript(plugin_path + "chart.flot/jquery.flot.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.resize.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.time.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.fillbetween.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.orderBars.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.pie.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.tooltip.min.js", function(){ // demo js script - or add js code directly here! loadScript("assets/js/view/demo.graphs.flot.js"); }); }); }); }); }); }); });
Realtime Chart
<!-- HTML --> <div id="flot-realtime" class="flot-chart height-300"><!-- FLOT CONTAINER --></div> <!-- JAVASCRIPT --> For javascript code example, see assets/js/view/demo.graphs.flot.js <!-- JS LOAD --> loadScript(plugin_path + "chart.flot/jquery.flot.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.resize.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.time.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.fillbetween.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.orderBars.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.pie.min.js", function(){ loadScript(plugin_path + "chart.flot/jquery.flot.tooltip.min.js", function(){ // demo js script - or add js code directly here! loadScript("assets/js/view/demo.graphs.flot.js"); }); }); }); }); }); }); });