向谷歌地圖添加另一個標記打破了地圖

我有一張地圖去協調，然後顯示所有附近的健身，學校，雜貨店和火車站。向谷歌地圖添加另一個標記打破了地圖

問題是我想添加另一個標記，它位於我正在關注的協調頂部。

我試過使用下面的代碼添加一個，但每當我做它只是不加載地圖。

var marker_home = new google.maps.Marker({ 
    map: map, 
    position: place.geometry.location, 
    icon: home_icon 
    });

我下面的代碼：

<!DOCTYPE html> 
    <html> 
    <head> 
    <title>Place searches</title> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <style> 
     html, body, #map-canvas { 
     height: 100%; 
     margin: 0px; 
     padding: 0px 
     } 
    </style> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&libraries=places"></script> 
    <script> 
    var map; 
    var infowindow; 

    function initialize() { 
     var home = new google.maps.LatLng(52.0930779, 5.0142526); 

     map = new google.maps.Map(document.getElementById('map-canvas'), { 
     center: home, 
     zoom: 15 
     }); 

     var request = { 
     location: home, 
     radius: 800, 
     types: ['gym', 'grocery_or_supermarket', 'train_station', 'school'] 
     }; 

     infowindow = new google.maps.InfoWindow(); 
     var service = new google.maps.places.PlacesService(map); 
     service.nearbySearch(request, callback); 
    } 

    function callback(results, status) { 
     if (status == google.maps.places.PlacesServiceStatus.OK) { 
     for (var i = 0; i < results.length; i++) { 
      createMarker(results[i]); 
     } 
     } 
    } 

    var home_icon = 'http://wisteriahill.sakura.ne.jp/GMAP/GMAP_MARKER_E/images/red1.png'; 
    var grocery_icon = 'http://wisteriahill.sakura.ne.jp/GMAP/GMAP_MARKER_E/images/red1.png'; 
    var school_icon = 'http://wisteriahill.sakura.ne.jp/GMAP/GMAP_MARKER_E/images/red1.png'; 
    var gym_icon = 'http://wisteriahill.sakura.ne.jp/GMAP/GMAP_MARKER_E/images/red1.png'; 
    var treinstation_icon = 'http://wisteriahill.sakura.ne.jp/GMAP/GMAP_MARKER_E/images/red1.png'; 

    function createMarker(place) { 
     var custom_icon; 

     if(place.types.indexOf('grocery_or_supermarket') != -1) { 
     custom_icon = grocery_icon; 
     } else if(place.types.indexOf('gym') != -1) { 
     custom_icon = gym_icon; 
     } else if(place.types.indexOf('train_station') != -1) { 
     custom_icon = treinstation_icon; 
     } else if(place.types.indexOf('school') != -1) { 
     custom_icon = school_icon; 
     } 

     var marker = new google.maps.Marker({ 
     map: map, 
     position: place.geometry.location, 
     title: place.name, 
     icon: custom_icon 
     }); 

     google.maps.event.addListener(marker, 'click', function() { 
     infowindow.setContent(place.name); 
     infowindow.open(map, this); 
     }); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
    </head> 
    <body> 
    <div id="map-canvas"></div> 
    </body> 
</html>

來源

2014-05-06 user1433479

所以你想在點擊上添加一個標記，或者你想要一個可拖動的標記並獲取位置latlng值？ –

@ gaurravv5我想要一個標記出現在地圖加載時的家居座標上。 – user1433479

發生任何JS錯誤？您在什麼時候嘗試創建'marker_home'？ – duncan

如果你想創建標記「上置座標時，地圖加載」，只需添加到您的initialize功能：

var marker_home = new google.maps.Marker({ 
    map: map, 
    position: home, 
    icon: home_icon 
});

來源

2014-05-06 12:33:14 duncan

謝謝。我不知道我必須從我的初始化中調用它，因爲'home_icon'正在初始化之外定義。我刪除了'home_icon'，並將圖片的網址放在'google.maps.Marker'中，因爲我一次只會調用它。 – user1433479

向谷歌地圖添加另一個標記打破了地圖

回答

相關問題