[GIS] Passing data into leaflet js via a php script

leafletPHP

I'm trying to display route data on a map using leaflet. I'm pulling the data from a MYSQL database with a php script. which is working. The data is stored in an array called vechiclelatlong. I use <?php include('../php/vTrackerv3.php'); ?> under the Javascript tag where is have my Leaflet script. I am getting the following error:

Uncaught ReferenceError: vehiclelatlong is not defined

See scripts below:

PHP script:

<php   
function vData(){   
include("dbconnecti.php");

$strtDate = strtotime('20150404');
$endDate = strtotime('20150405');

$query = "SELECT ED.latitude, ED.longitude, ED.timestamp, ED.creationTime 
FROM EventData ED 
WHERE ED.latitude <> 0 AND ED.longitude <> 0 AND (ED.timestamp >= $strtDate)  AND (ED.timestamp <= $endDate)";
$results = $dbconnect->query($query);

if (!$results)  {
    echo mysql_error();
    die('There was an error excuting query statment: ' ); //. mysqli_error());
}

$num_of_rows = $results -> num_rows;
$data = array();

echo "var vehiclelatlong = [";

for ($x = 0; $x < $num_of_rows; $x++)   {
    $data[] = $results -> fetch_assoc();

    echo "[".$data[$x]['latitude'].",".$data[$x]['longitude']."]";
    if ($x <= $num_of_rows - 2)  
    {
        echo ",";
    }
  }

  echo "];";

}
vData();
?>

HTML script

 <!DOCTYPE html>   
 <html>    
 <head>    
    <title>Tobago Street Map </title>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/black-tie/jquery-ui.css" type="text/css" /> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" charset="utf-8"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" charset="utf-8"></script>
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
    <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
    <script type="text/javascript" src="../js/vTracker.js"></script>

 </head>

 <body>
    <div id="map_canvas" style="width: 1400px; height: 600px"></div>

 <script>

    **"<?php include('../php/vTrackerv3.php'); ?>"**

    var map = new L.Map('map_canvas',{doubleClickZoom:false,zoomControl:false}).setView(new L.LatLng(11.18269,  -60.73760), 16);        mapLink = 
        '<a href="http://openstreetmap.org">OpenStreetMap</a>';
    L.tileLayer(
        'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: 'Map data &copy; ' + mapLink,
        maxZoom: 18,
        }).addTo(map);
    var polyline = L.polyline(vehiclelatlong).addTo(map);
</script>

</body>
</html>

Best Answer

While your PHP looks to be creating an array, I'm not sure that you're going to have consistent luck getting JS to read it that way (an arrant space here or there, etc.). At least I've tried that in the past, only to realize that while it LOOKS like a good array, it isn't.

I think you're better off just returning your MySQL as a true array and then using json_encode($array) to get it in something that will consistently be read by JS.

Something like

var vehiclelatlong = <?php json_encode($array); ?>;

EDIT: Lets stick with your array (although JSON ~ GEOJSON and there are good PHP GEO tools out there). I got it to work doing the following.
1. made sure both files had a *.php extension
2. removed **" on either side of my include statement in my main page
3. made sure my included file was correctly referenced in my main page
4. made sure my DB query was returning a valid result. I made some changes (including just trying it using SQLite) but you can see the same result.

<?php   
function vData(){  
$db = new PDO("sqlite:so.db");
$query = "SELECT latitude, longitude FROM EventData";
$statement1 = $db->prepare($query);
$statement1->execute();
$results = $statement1->fetchall(PDO::FETCH_ASSOC);
echo "var vehiclelatlong = [";
$count=1;
foreach ($results as $result)   {
echo "[".$result['latitude'].",".$result['longitude']."]";
if ($count < count($results)) echo ",";
$count++;
}
echo "];";
}
vData();
?>
Related Question