2014-01-23 11 views
1

Я пытаюсь настроить простую страницу для отображения маркера в местоположении с помощью API Карт Google. Однако я не получаю маркер с этим кодом, который основан на примере кода Googles here. Я изменил источник изОтображение маркера с API Карт Google

"https://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=false" 

в

"http://maps.google.com/maps/api/js?sensor=false" 

, потому что это было рекомендовано here с целью предотвращения использования ключа API. Объявление маркера var копируется из Google here. Что должно измениться для моего маркера?


<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map-canvas { height: 100% } 
    </style> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    </script> 
    <script type="text/javascript"> 
     function initialize() { 

     var location = new google.maps.LatLng(59.272, 10.418); 

     var mapOptions = { 
      center: location, 
      zoom: 8 
     }; 

     var marker = new google.maps.Marker({ 
      position: location, 
      map: map, 
      title: 'Hello World!' 
     }); 

     var map = new google.maps.Map(document.getElementById("map-canvas"), 
      mapOptions); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div id="map-canvas"/> 
    </body> 
</html> 

ответ

5

Перемещение установки на карту перед настраиваете маркер линии строки, так как маркер использует карту в своем вызове:

function initialize() { 
    var location = new google.maps.LatLng(59.272, 10.418); 

    var mapOptions = { 
    center: location, 
    zoom: 8 
    }; 

    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 

    var marker = new google.maps.Marker({ 
    position: location, 
    map: map, 
    title: 'Hello World!' 
    }); 
} 
+0

Великие умы :). – Swires

+0

Спасибо @ Энди. вы спасли мое время. У меня есть еще одно сомнение. Я хочу показать подробности о окне маркера. Можете ли вы предложить мне. –

0

Переместить объявление ваших маркеров после объявления карты, а затем назначить маркер на карту, как так:

var map = new google.maps.Map(document.getElementById("map-canvas"), 
     mapOptions); 

var marker = new google.maps.Marker({ 
     position: location, 
     map: map, 
     title: 'Hello World!' 
    }); 

marker.setMap(map); 

Примечания, установка карты не является обязательным, и может быть используется вместо установки карты при создании маркера.

Смежные вопросы