[GIS] Openlayers loop through json array and output result with as javascript

javascriptjqueryjsonopenlayers-2

Connection.php file which stored database connection code with json:

<?php
$username = "root";
$password = "";
$database = "roadmap";
$url = "localhost";

$con = mysql_connect($url, $username , $password);
if (!$con)
{
die('Could not connect:' . mysql_error());
}

mysql_select_db($database, $con) ;
$data = array();
// query your DataBase here looking for a match to $input
$query = mysql_query("SELECT * FROM students");
while ($row = mysql_fetch_assoc($query)) {
$json = array();
$json['Id'] = $row['Id'];
$json['Lon'] = $row['Lon'];
$json['Lat'] = $row['Lat'];
$data[] = $json;
}
header("Content-type: application/json");
echo json_encode($data);
mysql_close($con);
    ?>

In separate file index.php:

$.getJSON("connection.php", function(data) {
            addMarker( data[0].Lon,data[0].Lat ,data[0].desc);
            addMarker(-0.13264,51.50918 , );
            addMarker( -0.12498,51.50807 , );
            center = bounds.getCenterLonLat();
            map.setCenter(center, map.getZoomForExtent(bounds) - 1);
            zoom = map.getZoom();

        });

this currently pulls the json data through and I have to use it for each individual assigning of a part from the database such as data[0].lon will get the longitude entry for the first record with in the database.

As I am going to be working with quite a few entry's. I want to loop through the json array and then out put all records as so:

addMarker( RECORD 1 );

addMarker( RECORD 2 );

addMarker( RECORD 3 );

Can anyone help me with this.

Best Answer

I think I read somewhere recently that Markers is not the recommended way to do this anymore, that support would not continue, just not 100% sure about it and I can't find it back immediately. But you could easily make geoJSON from this code which is just another Vector layer. Since now you are actually trying to do what the OpenLayers api has implemented for you already.

Even exporting to KML and adding it as a layer can be an options. but since you have json already it would be the most obvious. There's an example illustrating this.

for dynamic data (since that example, the geojson is defined in the code) you could try this (by heart):

   var protocol = new OpenLayers.Protocol.HTTP({
            url: "index.php?output=geojson" + Math.random(),
            format: new OpenLayers.Format.geoJSON({
                  extractStyles: true, 
                  extractAttributes: true
               })
            });

   var geojsonlayer = new OpenLayers.Layer.Vector("MyData", {
            strategies: [new OpenLayers.Strategy.Fixed()],
            protocol: protocol,
         });

Now all you need to do is create geoJSON output from the server side and look into how you can customize your icons or not. the same goes for KML, same principle.

Related Question