php - How to display multiple Latitude and Longitude on Google Map -


i have multiple lat/long in array in php, code available display lat/long display single lat/long, tried iterate array in for loop, didn't work shown below:

<html>     <head>         <style type="text/css">             div#map {                 position: relative;             }              div#crosshair {                 position: absolute;                 top: 192px;                 height: 19px;                 width: 19px;                 left: 50%;                 margin-left: -8px;                 display: block;                 background: url(crosshair.gif);                 background-position: center center;                 background-repeat: no-repeat;             }         </style>         <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>         <script type="text/javascript">             var map;             var geocoder;             var centerchangedlast;             var reversegeocodedlast;             var currentreversegeocoderesponse;              function initialize() {                 <?php for($i=0;$i<count($data);$i++){?>                 var latlng = new google.maps.latlng(<?php echo $data[$i]['lat'].','.$data[$i]['long']; ?>);                 var myoptions = {                     zoom: 40,                     center: latlng,                     maptypeid: google.maps.maptypeid.roadmap                 };                 map = new google.maps.map(document.getelementbyid("map_canvas"), myoptions);                 geocoder = new google.maps.geocoder();                  var marker = new google.maps.marker({                     position: latlng,                     map: map,                     title: "<?php echo $data[$i]['deviceid'];?>"                 });                 <?php }?>             }          </script>     </head>     <body onload="initialize()">         <div id="map" style="width:200px; height:200px">             <div id="map_canvas" style="width:100%; height:200px"></div>             <div id="crosshair"></div>         </div>       </body> </html> 

i suspect there must parameter multiple in javasctipt code make work, not sure about... 1 on this.

you creating new map in every iteration. place map definition , geocoder definition outside foreach:

function initialize() {     var myoptions = {         zoom: 40,         center: latlng,   // set default latlng here, e.g $data[0]['lat'], $data[0]['lng']         maptypeid: google.maps.maptypeid.roadmap     };     map = new google.maps.map(document.getelementbyid("map_canvas"), myoptions);     geocoder = new google.maps.geocoder();     <?php for($i=0;$i<count($data);$i++){?>     var latlng = new google.maps.latlng(<?php echo $data[$i]['lat'].','.$data[$i]['long']; ?>);     var marker = new google.maps.marker({         position: latlng,         map: map,         title: "<?php echo $data[$i]['deviceid'];?>"     });     <?php }?> } 

Comments

Popular posts from this blog

c# - Send Image in Json : 400 Bad request -

javascript - addthis share facebook and google+ url -

ios - Show keyboard with UITextField in the input accessory view -