Air Quality


Nella cartella “custom” bisogna creare il file e la cartella:

  • custom /home.php
  • custom/purpleair/pourplair-sql.php

creiamo il file home.php inserendo il codice seguente:

<?php

    ############################################################################
	# 	Meteotemplate
	# 	http://www.meteotemplate.com
	# 	Free website template for weather enthusiasts
	# 	Author: Jachym
	#           Brno, Czech Republic
	# 	First release: 2015
	#
	############################################################################
	#
	#	Blank Page
	#
	# 	Template for blank page
	#
	############################################################################
	
	include("../config.php");
	include($baseURL."css/design.php");
	//include($baseURL."header.php");
?>
<!DOCTYPE html>
<html>
	<head>
		<title><?php echo $pageName?></title>
	 
			
		</style>
	</head>
	<body>
		<div id="main_top">
		 
		</div>
		<div id="main">
			<div class="textDiv">
			<?php
   

$queryA = $_GET['query'];
 
 
//$pisolo =  date ("d m Y");
if ($queryA == True) 

{$query = $_GET['query'];
 
}
    else { $query =  date ("d m Y");
            
    }
?>
 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
   <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>     
 
  <script>
  $( function() {
    $( "#datepicker" ).datepicker({
        //Consistent format with the HTML5 picker
        //dateFormat: 'yy-mm-dd'
        //numberOfMonths : [2,3],
        dateFormat: 'dd mm yy',
        
    });
     $( "#datepicker" ).datepicker("show"); 
  } );
  </script>
 
 
 
 
  <h4 style="color:#fff;">
   Per visualizzare l'archivio bisogna selezionare la data dal calendario, premere 'Ricerca....'</h4> 
 
   
    <form action="" method="GET" style=" height:70px;">
    <input type="text" id="datepicker"  name="query" placeholder="Apri calendario"/>
         
        <input type="submit" value="Ricerca" />
    </form> 
 
<!-- ****************************************************************************************************************************-->
 
 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'PM 2.5','PM 10' ],
         <?php include ('purpleair/pourplair-sql.php') ; ?>
        ]);

        
        
var options = {  
        title: 'Air Quality PM2.5 AQI date: <?php echo  $row['date_format'];?> ',        
          legend: { position: 'bottom' } ,
          is3D:true,
          FontSize:7,
          backgroundColor: '#E4E4E4', 
         colors: ['#5c3292' , '#FF6600'],
          
        };


        
        var chart = new google.visualization.LineChart(document.getElementById('pm2.5curve_chart'));

        chart.draw(data, options);
      }
    </script> 
   <div id="pm2.5curve_chart" style="width: 100%; height: 300px"></div>


            
            </div>
		</div>

creiamo la cartella purpleair e dentro creiamo il file pourplair-sql.php inserendo il codice seguente:

<?php
 $hostname="xxxxxxxxxxxxx";
$username="xxxxxxxxxxxxx";
$password="xxxxxxxxxxxxx";
$db = "xxxxxxxxxxxxx"; 
 $dbh = new PDO("mysql:host=$hostname;dbname=$db", $username, $password);
 
foreach($dbh->query("SELECT  *, date_format(Date_Time, '%d %m %Y') date_format, date_format(Date_Time, '%H:%i') date_format2
                
         FROM purpleair   WHERE date_format(Date_Time, '%d %m %Y')='".$query."'  ") as $row)  { 
          
          echo "['". $row['date_format2'] ."'," . $row['Valore'] . "," . $row['pm10'] . "]," ; 
   
   ?>
   
     <?php
  }
  ?> 

Author: martinezwebmaster

Lascia un commento

Il tuo indirizzo email non sarĂ  pubblicato. I campi obbligatori sono contrassegnati *