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>
マーカークリック後のイベントの伝播を停止してください: 'event.stopPropagation'を' selectScene'関数に追加してください。いくつかのブラウザでは、関数は伝播を止めるために 'false'を返さなければなりません。 –