2017-08-23 2 views
1

Ich versuche, eine HTML-Schaltfläche über die native Cordova Google Maps Div setzen.Klicken Sie auf Ereignisse auf Schaltflächen über Google Maps div?

Das Problem ist, dass die Ebene der Karte kontinuierlich Fokus anfordert.

Wenn ich das Ereignis "setClickable (false)" verwende, funktionieren die Schaltflächen korrekt, aber die Karte ist nicht verwendbar.

Jeder Weg, dies zu tun?

Antwort

1

Legen Sie die Tasten innerhalb des div, wo die Karte ist, wie folgt aus:

<ion-header> 
    <ion-navbar color="primary"> 
     <ion-title>Map Demo</ion-title> 
    </ion-navbar> 
</ion-header> 
<ion-content> 
    <div #map id="map" style="height:100%;"> 
     <div class="action-buttons"> 
      <button color="primary" ion-button text-only> 
       Button 1 
      </button> 
      <button color="primary" ion-button text-only> 
       Button 2 
      </button> 
     </div> 
    </div> 
</ion-content> 

Und sie dann setzen, wo Sie durch Einstellen der Position des Behälters, ist der absolute Wert sein:

.action-buttons { 
    display: block; 
    width: calc(100% - 16px); 
    position: absolute; 
    top: 16px; 
    right: 16px; 
    text-align: right; 
    z-index: 999; 

    button { 
     display: inline-block; 
     margin: 4px; 
    } 
} 
+1

Danke, es funktioniert wie ein Charme! – Hanzo

+0

Froh, das zu hören! :) – sebaferreras

Verwandte Themen