Estou usando ionic para criar um app onde uso a api do google maps eu preciso colocar alguns botões flutuando sobre esse mapa, como na imagem.
Eu achei um pedaço de código que parece ter funcionado pra pessoa, mas aqui comigo não funciona, parece que o botão fica atrás do mapa. Tentei aumentar o z-index, mas não consegui. Tentei também criar os botões dentro da div do #map, mas não aparecem.
Vou deixar o código para verem como estou tentando fazer.
initMap(lat, lng) {
this.map = new google.maps.Map(this.mapElement.nativeElement, {
zoom: 16,
center: { lat: lat, lng: lng },
mapTypeControl: true,
streetViewControl: true,
fullscreenControl: false,
zoomControlOptions: {
position: google.maps.ControlPosition.LEFT_BOTTOM
}
})
//### Add a button on Google Maps ...
var controlMarkerUI = document.createElement('DIV');
controlMarkerUI.style.cursor = 'pointer';
controlMarkerUI.style.backgroundImage = "url(http://localhost/car.png)";
controlMarkerUI.style.height = '28px';
controlMarkerUI.style.width = '25px';
controlMarkerUI.style.top = '11px';
controlMarkerUI.style.left = '120px';
controlMarkerUI.title = 'Click to set the map to Home';
//myLocationControlDiv.appendChild(controlUI);
this.map.controls[google.maps.ControlPosition.BOTTOM_CENTER].push(controlMarkerUI);}
Agradeço qualquer ajuda.