Home forums Using CanvasJS load all files from folder and make a chart foreach file. Reply To: load all files from folder and make a chart foreach file.

#24421

The “project” files are:
– test_LAN.php:

<?php
$i = 0;
$file_txt = file(‘./Storico_TestLAN/LAN-BO-DC2012.txt’);

//[0] => 02/06 05:00:02 DATA
//[1] => 11 DOWNLOAD
//[2] => 38 PING
//[3] => LO-DC2012 HOSTNAME
//[4] => 2 [5] UPLOAD
foreach ($file_txt as $line) {
$valori = explode(“;”, $line);
$Download[$i] = array(“y” => $valori[1],”label” => $valori[0] );
$Upload[$i] = array(“y” => $valori[4],”label” => $valori[0] );
$Ping[$i] = array(“y” => $valori[2],”label” => $valori[0] );
$i++;
}
?>
<!DOCTYPE HTML>
<html>
<head>
<script type=”text/javascript”>
window.onload = function () {

var chart1 = new CanvasJS.Chart(“chartContainer”, {
animationEnabled: true,
animationDuration: 590,
zoomEnabled: true,
title: {
text: “Speed test LAN: <?php echo trim($valori[3]) ?>”
},
exportEnabled: true,
legend:{
cursor: “pointer”,
},
toolTip: {
shared: true
},
axisX:{
crosshair: {
enabled: true,
color: “red”,
lineDashType: “solid”,
},
labelFontSize: 15,
gridThickness: 0.6,
minimum: -0.3,
maximum: 12,
},
data: [{
type: “stackedArea”,
name: “Download”,
color: “#00f731”,
showInLegend: true,
yValueFormatString: “#,##0 [MBit/s]”,
dataPoints: <?php echo json_encode($Download, JSON_NUMERIC_CHECK); ?>
},
{
type: “stackedArea”,
name: “Upload”,
color: “#007bf7”,
showInLegend: true,
yValueFormatString: “#,##0 [MBit/s]”,
dataPoints: <?php echo json_encode($Upload, JSON_NUMERIC_CHECK); ?>
},
{
type: “stackedArea”,
name: “Ping”,
color: “#494c4f”,
showInLegend: true,
yValueFormatString: “#,##0 [ms]”,
dataPoints: <?php echo json_encode($Ping, JSON_NUMERIC_CHECK); ?>
},]
});
chart1.options.axisX.minimum = -0.3;
chart1.options.axisX.maximum = 24;
chart1.render();

document.getElementById(“Giorno”).addEventListener(“click”, function(){
chart1.options.axisX.minimum = -0.3;
chart1.options.axisX.maximum = 24;
chart1.render();
})
document.getElementById(“Mese”).addEventListener(“click”, function(){
chart1.options.axisX.minimum = -0.3;
chart1.options.axisX.maximum = 320;
chart1.render();
})
}
</script>
<script type=”text/javascript” src=”chart.js”></script>
</head>
<body>
<div id=”chartContainer” style=”height: 360px; width: 100%;”></div>
<button id=”Giorno”>Ultimo Giorno</button>
<button id=”Mese”>Ultimo Mese</button>
</body>
</html>

– the file txt from: ./Storico_TestLAN/LAN-BO-DC2012.txt
02/21 10:00:01 ;12;31;BO-DC2012;11;
02/21 09:00:01 ;12;31;BO-DC2012;11;
02/21 08:00:02 ;12;31;BO-DC2012;11;
02/21 07:00:01 ;12;31;BO-DC2012;11;
02/21 06:00:01 ;10;31;BO-DC2012;11;
02/21 05:00:01 ;12;31;BO-DC2012;10;
02/21 04:00:01 ;10;31;BO-DC2012;11;
02/21 03:00:01 ;12;31;BO-DC2012;11;
02/21 02:00:01 ;12;32;BO-DC2012;11;
02/21 01:00:00 ;11;31;BO-DC2012;11;

I have 12 file txt, I would like to make in ONE page php/html 12 charts from my 12 *txt files.
thanks