2012-10-17 4 views
0

Google지도를 처음 사용합니다. ASP.NET 4.0 프로젝트에서 aspx 파일에 Google Maps v3지도가 추가되었으며 맵에있는 네 개의 KML 레이어에 대한 토글 체크 박스를 추가하려고합니다.Google지도 v3 : 'setMap'속성 값을 가져올 수 없습니다.

그러나 확인란을 클릭하면 "Microsoft JScript 런타임 오류 : 'setMap'속성 값을 가져올 수 없습니다. 개체가 null이거나 정의되지 않았습니다. '라는 오류가 발생합니다. 고맙습니다!

다음
<body onload="initialize()">  
     <div id="map-canvas" style="width:100%; height:90%;"></div> 
     <div id="legend"> 
      <div class="column"> 
       <input type="checkbox" id="landmarksLayer" onclick="toggleKMLLayer(this,'Notable Locations');" checked="checked" />Notable Locations (<img alt="yellow dot" src="Images/GoogleMaps/yellow-dot.png" />) 
      </div> 
     </div> 
    </body> 

는 자바 스크립트입니다 : 여기

는 HTML입니다

<%--Javascript--%> 
    <script type="text/JavaScript" src="http://maps.googleapis.com/maps/api/js?key=[I_Removed_My_Key]&sensor=false"></script> 

    <script type="text/javascript"> 

     var infowindow = new google.maps.InfoWindow({ "maxWidth": 100 }); 

     var map; 

     var landmarksLayer; 
     var publicArtLayer; 
     var blueEmergencyPhonesLayer; 
     var buildingsLayer; 

     //toggle 
     function toggleKMLLayer(chkbox, kmlLayerID) { 

      //window.alert(kmlLayerID); 

      if (chkbox.checked) { 
       //window.alert("checked"); 
       landmarksLayer.setMap(map); 
      } 
      else { 
       //window.alert("unchecked"); 
       landmarksLayer.setMap(null); 
      } 
     } 

     function initialize() { 

      var mapOptions = { 
       center: new google.maps.LatLng(33.585737, -101.884804), 
       zoom: 15, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 

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

      var kmlLayerOptions = { 
       preserveViewport: true, 
       suppressInfoWindows: true 
      }; 

      var landmarksLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/landmarks.xml', kmlLayerOptions); 
      landmarksLayer.setMap(map); 

      var publicArtLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/art.xml', kmlLayerOptions); 
      publicArtLayer.setMap(map); 

      var blueEmergencyPhonesLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/emergency.xml', kmlLayerOptions); 
      blueEmergencyPhonesLayer.setMap(map); 

      var buildingsLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/bldgs.xml', kmlLayerOptions); 
      buildingsLayer.setMap(map); 


      addKmlClickHandler(landmarksLayer); 
      addKmlClickHandler(publicArtLayer); 
      addKmlClickHandler(blueEmergencyPhonesLayer); 
      addKmlClickHandler(buildingsLayer); 
     } 

     // create a new info window for the KML (outage) layer and the geo-coded house marker 
     function addKmlClickHandler(KmlLayer) { 
      google.maps.event.addListener(KmlLayer, "click", function (event) { 
       infowindow.close(); 
       infowindow.setOptions({ 
        pixelOffset: event.pixelOffset, 
        content: event.featureData.infoWindowHtml, 
        position: event.latLng 
       }); 
       infowindow.open(map); 
      }); 
     } 

    </script> 

답변

2

당신은 당신의 레이어에 대한 전역 변수를 만드는 :

var landmarksLayer; 
    var publicArtLayer; 
    var blueEmergencyPhonesLayer; 
    var buildingsLayer; 

하지만 당신은 사용하지 않는 그들 (귀하의 초기화 기능 내부) :

var landmarksLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/landmarks.xml', kmlLayerOptions); 
    landmarksLayer.setMap(map); 

    var publicArtLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/art.xml', kmlLayerOptions); 
    publicArtLayer.setMap(map); 

    var blueEmergencyPhonesLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/emergency.xml', kmlLayerOptions); 
    blueEmergencyPhonesLayer.setMap(map); 

    var buildingsLayer = new google.maps.KmlLayer('http://www.ttu.edu/map/points/bldgs.xml', kmlLayerOptions); 
    buildingsLayer.setMap(map); 

변수 앞에 "var"을 붙이면 초기화 기능에 로컬 인 변수의 새 버전이 만들어지고 전역 버전은 초기화되지 않습니다. HTML 클릭 리스너 (글로벌 컨텍스트에서 실행)에서 사용할 수 있도록 초기화 된 전역 버전이 필요합니다.

관련 문제