2016-05-20 29 views
-1

我打電話給web服務,並得到像這樣的點標記和響應latlong。如何在地圖中標記標記?我無法指向標記

{"status":"true","msg":"Stops found","stops":[{"bus_stop_name":"Borivali Station MTNL","bus_stop_address":"Swami Vivekanand Road, Sundar Nagar, Borivali West, Mumbai, Maharashtra 400092, India","bus_stop_lat":"19.23053918952814","bus_stop_long":"72.8566252096482"},{"bus_stop_name":"Ragulella Mall","bus_stop_address":"3, Boraspada Rd, Jai Bhim Sanjay Nagar, Kandivali West, Mumbai, Maharashtra 400067, India","bus_stop_lat":"19.21296566246441","bus_stop_long":"72.84949920740974"},{"bus_stop_name":"Malad Inorbit Mall","bus_stop_address":"Inorbit Rd, Mindspace, Goregaon West, Mumbai, Maharashtra 400104, India","bus_stop_lat":"19.1733183","bus_stop_long":"72.83624800000007"},{"bus_stop_name":"Goregaon Hub","bus_stop_address":"Sati Industries, St Yadav Marg, Cama Industrial Estate, Goregaon, Mumbai, Maharashtra 400063, India","bus_stop_lat":"19.15472855610745","bus_stop_long":"72.85655620740965"}]} 

並解析此響應並傳遞latlng就像這樣,但標記不顯示。

var jsonData2 = JSON.parse(stops); 
    var infowindow = new google.maps.InfoWindow(); 
    for (var i = 0; i < jsonData2.stops.length; i++) { 

    var myLatLng = {lat: parseFloat(jsonData2.stops[i].bus_stop_lat), lng: parseFloat(jsonData2.stops[i].bus_stop_long)}; 

    var title = jsonData2.stops[i].bus_stop_name; 

    var marker = new google.maps.Marker({ 
       position: myLatLng, 
       map: map, 
       title: title, 
       icon: 'http://globe.dot.ca.gov/images/icons/bus32.png', 
       }); 

    google.maps.event.addListener(marker, 'click', (function (marker, i) { 
     return function() {     infowindow.setContent(jsonData2.stops[i].bus_stop_name); 
     infowindow.open(map, marker); 
    } 
    })(marker, i)); 
} 
+0

[發佈的代碼適合我(小提琴)](http://jsfiddle.net/geocodezip/Lr9bz1mc/1/),問題必須在訪問Web服務。 – geocodezip

回答

0
<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Simple markers</title> 
    <style> 
     html, body { 
     height: 100%; 
     margin: 0; 
     padding: 0; 
     } 
     #map { 
     height: 100%; 
     } 
    </style> 
    </head> 
    <body> 
    <div id="map"></div> 
    <script> 

     function initMap() { 
     var myLatLng = {lat: -25.363, lng: 131.044}; 

     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 4, 
      center: myLatLng 
     }); 

     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      title: 'Hello World!' 
     }); 
     } 
    </script> 
    <script async defer 
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"> 
    </script> 
    </body> 
</html> 

參考。 https://developers.google.com/maps/documentation/javascript/examples/marker-simple

+0

謝謝..但這不是我的問題,當我使用靜態經緯度很長,它表現不錯,但當我這樣做動態這不是執行.. –