Google지도에서 마커를 볼 수 없습니다.

Google지도에서 일부 마커를 배치하려고합니다. 나는 코드를 작성했다.Google지도에서 마커를 볼 수 없습니다.

문제는 그 마커가 보이지 않는다는 것입니다.

콘솔을 확인했지만 오류가 표시되지 않았습니다.

내가 뭘 잘못하고 있니?

대단히 감사합니다.

<!DOCTYPE html> 
<html> 
    <head> 
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
     <meta charset="utf-8"> 
     <title>Directions service</title> 
     <style> 
      html, body, #map-canvas { 
       height: 100%; 
       margin: 0px; 
       padding: 0px 
      } 
      #panel { 
       position: absolute; 
       top: 5px; 
       left: 50%; 
       margin-left: -180px; 
       z-index: 5; 
       background-color: #fff; 
       padding: 5px; 
       border: 1px solid #999; 
      } 
     </style> 
     <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
     <script>    
      var map; 
      var styles = [ 
       { 
        stylers: [ 
         {hue: "#00ffe6"}, 
         {saturation: -20} 
        ] 
       }, { 
        featureType: "road", 
        elementType: "geometry", 
        stylers: [ 
         {lightness: 100}, 
         {visibility: "simplified"} 
        ] 
       }, { 
        featureType: "poi", 
        elementType: "labels", 
        stylers: [ 
         {visibility: "off"} 
        ] 
       }, { 
        featureType: "transit", 
        elementType: "labels", 
        stylers: [ 
         {visibility: "off"} 
        ] 
       }, 
      ]; 


      function initialize() {     
       var home = new google.maps.LatLng(45.666396, 25.611569); 
       var mapOptions = { 
        zoom: 15, 
        center: home 
       } 
       map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
       map.setOptions({styles: styles}); 

      } 

      var json = [ 
           { 
        "title": "Triaj", 
        "lat": 45.67573, 
        "lng": 25.647464, 
        "description": "Test"     
       },        { 
        "title": "Baza MTTC", 
        "lat": 45.671123, 
        "lng": 25.640974, 
        "description": "Test"     
       },        { 
        "title": "RAT Brasov", 
        "lat": 45.669687, 
        "lng": 25.638461, 
        "description": "Test"     
       }       ]; 

      for (var i = 0, length = json.length; i < length; i++) { 
       var data = json[i], latLng = new google.maps.LatLng(data.lat, data.lng); 

       // Creating a marker and putting it on the map 
       var marker = new google.maps.Marker({ 
        position: latLng, 
        map: map, 
        title: data.title 
       });         
      } 

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

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

출처

2014-06-13 Cosmin

당신은 그것을 트리거하기 위해 initialize α- 함수 내부의 JSON 및 마커 코드를 삽입 Should'nt?

지금은 for 루프가 트리거되지 않으므로 마커가 표시되지 않습니다. var json =과 모든 것을 for 루프 내부의 initialize 내부에 넣으십시오. 그러면 다음과 같이하십시오.

출처

2014-06-13 14:46:47 hansmei

예, 작동합니다. 감사합니다! – Cosmin

* for 루프 *를 트리거하는 것이 없습니다. : 올바르지 않습니다. for 루프가 실행되면 콘솔 로그를 사용하여 볼 수 있지만'map' 변수는 정의되지 않습니다. 'map'은'initialize()'가 호출 될 때 나중에 정의됩니다. 그렇지 않으면 당신 말이 맞습니다. –

네, 맞아요. jQuery ('$ (document) .ready()'가 누락 된 것 같아요.) 당시에. – hansmei

Google지도에서 마커를 볼 수 없습니다.

답변

관련 문제