Google 퓨전 맵 : 서클 차단 레이어 클릭 이벤트, 자바 스크립트

Question

다음 코드는 원형지도 영역을 기반으로 Google 융합 테이블을 쿼리합니다.

원형지도 영역의 중심은 사용자가 클릭하는 위치에 따라 결정되고 반경은 드롭 다운 메뉴에서 선택하여 결정됩니다. 사용자가 매핑 된 포인트를 클릭하면 해당 융합 테이블 행의 정보를 표시하는 정보 상자가 표시되도록 청취자가 설정되었습니다.

내지도에 서클을 추가하기 전까지 (사용자가 선택한 지역을 설명하기 위해)이 모든 것이 제대로 작동합니다. 원이 있으면 레이어의 클릭 이벤트 리스너가 차단 된 것으로 보입니다. 나는 아무 쓸모없는 Z- 색인을 바꾸려고 노력했다. 누구든지이 문제를 해결할 수있는 방법을 제안 해 주시겠습니까?

function initialize() {  

     tableid = xxxxxxx; 

       // Initialize the Google Map 
     var map = new google.maps.Map(document.getElementById('map_canvas'), { 
      center: new google.maps.LatLng(37.3, -122.3), 
      zoom: 8, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
                       });                   
     var layer = new google.maps.FusionTablesLayer({  
      query: { 
      select: 'Address', 
      from: tableid, 
      where: 'ST_INTERSECTS(Address, CIRCLE(LATLNG(37.3, -122.3), 5000))' 
        } 
                 }); 
     layer.setMap(map); 
     layer.index = 1; 
     map.index =2; 
     var meters = 5000; 
     var center = map.getCenter(); 

     // Update the radius when the user makes a selection. 
     google.maps.event.addDomListener(document.getElementById('radius'), 'change', function() { 
      meters = parseInt(this.value, 10); 
      circle.setRadius(meters); 
      searchStr = 'ST_INTERSECTS(Address, ' +'CIRCLE(LATLNG'+center+', ' + meters + '))' 
      searchStr += " AND " + "filter_1 IN ("+filterSelection+")"; 
      layer.setOptions({ 
       query: { 
       select: 'Address', 
       from: tableid, 
       where: searchStr 
         } 
           }); 
                            });                                                          //Update the filter when the user makes a selection. 
     google.maps.event.addDomListener(document.getElementById('filter'),'change', function() { 
      filterSelection = this.value; 
      searchStr = 'ST_INTERSECTS(Address, ' + 'CIRCLE(LATLNG'+center+', ' + meters + '))' 
      searchStr += " AND " + "filter_1 IN ("+filterSelection+")"; 
      layer.setOptions({ 
       query: { 
       select: 'Address', 
       from: tableid, 
       where: searchStr 
         } 
           }); 
                            }); 

     //Info Box Populate click handler 
     google.maps.event.addListener(layer, 'click', function(e) { 
      alert("Info Click"); 
      e.infoWindowHtml = e.row['Title'].value + "<br>"; 
                    }); 
     //Click Handler 
     google.maps.event.addListener(map, 'click', function(e) { 
      circle.setCenter(e.latLng); 
      center = e.latLng; 
      searchStr = 'ST_INTERSECTS(Address, ' + 'CIRCLE(LATLNG'+e.latLng+', ' + meters + '))' 
      searchStr += " AND " + "filter_1 IN ("+filterSelection+")"; 
      layer.setOptions({ 
       query: { 
       select: 'Address', 
       from: tableid, 
       where: searchStr 
         } 
           }); 
                    });  
     // Create a map circle object to visually show the radius. 
     var circle = new google.maps.Circle({ 
      center: new google.maps.LatLng(37.3, -122.3), 
      radius: 5000, 
      map: map, 
      fillOpacity: 0.1, 
      strokeOpacity: 0.5, 
      strokeWeight: 1 
              }); 
     circle.index = 0; 
     circle.setmap(map); 
         } 

Answer 1

당신이 원을 만들 때 CircleOptions이 clickable: false

그것은 작동