0

我使用NgMap並有一些標記。當鼠標在標記上方時,我會將一個「自定義標記」顯示爲infoWindow。問題是當自定義標記出現時,如果它下面有標記,它仍然是可點擊的。如何使自定義標記浮動在地圖上或使地圖不能在自定義標記下單擊?如何讓Google地圖在自定義標記下無法點擊?

<ng-map center="current-location" 
    id="map" 
    zoom-control="true" 
    zoom-control-options="{style:'LARGE', position:'RIGHT_BOTTOM'}" 
    scale-control="true" 
    street-view-control="false" 
    map-type-control="true" 
    map-type-control-options="{style:'HORIZONTAL_BAR', position:'LEFT_BOTTOM'}" 
    style="height:100%;width:100%;position: absolute" 
> 
<marker 
     ng-repeat="scene in vm.scenes" 
     position="{{scene.location}}" 
     id="marker{{$index}}" 
     draggable="{{scene.draggable}}" 
     on-dragend="vm.getNewLocation()" 
     icon="{{scene.markerPath}}" 
     on-mouseover="vm.showWindow(event, scene)" 
     opacity="{{scene.opacity}}" 
     on-click="vm.selectScene(event, scene)" 
     on-mouseout="vm.hideWindow(event)" 
> 
</marker> 

<custom-marker 
     visible="{{vm.options.showInfo === true}}" 
     id="customMarker" 
     position="{{vm.infoScene.location}}" 
> 

    <md-card md-theme="text-theme" flex style="opacity: 0.9;" 
      ng-mouseleave="vm.hideWindowCustom()" 
      ng-mouseover="vm.keepWindow()" 
    > 
     <md-card-content flex> 

      <img ng-src="{{vm.infoScene.photo_url}}" width="200" height="200"> 

      <md-input-container class="md-block"> 

      <textarea ng-change="vm.options.hasChanges = true" ng-model="vm.infoScene.short_description" 
         md-maxlength="70" 
         md-select-on-focus></textarea> 
      </md-input-container> 
     </md-card-content> 
    </md-card> 
</custom-marker> 
</ng-map> 
+1

嘗試在標記點擊後停止事件傳播:將'event.stopPropagation'添加到'selectScene'函數。在某些瀏覽器上,函數還需要返回'false'來停止傳播。 –

回答

相關問題