function initMap() { var mycompany = { lat: 44.348534, lng: -79.669197 }; var map = new google.maps.Map(document.getElementById('map'), { center: mycompany, zoom: 14, scrollwheel: false, mapTypeControl: false }); var contentString = '<div class="iw-content">' + '<div class="iw-subTitle">My company </div>' + '<p>455 street</p>' + '<p>City, World</p>' + '<p>Canada, Postalcode</p>' + '</div>'; var infowindow = new google.maps.InfoWindow({ content: contentString }); var marker = new google.maps.Marker({ position: mycompany, map: map, title: 'My company' }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(map, marker); }); google.maps.event.addListener(map, 'click', function() { infowindow.close(); }); } initMap()
html, body, #map { height: 100%; width: 100%; margin: 0px; padding: 0px } /*style the box*/ .gm-style .gm-style-iw { background-color: #252525 !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; min-height: 120px !important; padding-top: 10px; display: block !important; } /*style the p tag*/ .gm-style .gm-style-iw #google-popup p{ padding: 10px; } /*style the arrow*/ .gm-style div div div div div div div div { background-color: #252525 !important; padding: 0; margin: 0; padding: 0; top: 0; color: #fff; font-size: 16px; }
<div id="map"></div>
Aplicando Css a la ventana de información en el mapa de Google en vuejs en HTML, funciona bien, quiero decir en jsfiddle pero cometer vue no estaba funcionando. Necesito aplicar CSS a la información sobre herramientas generada por el mapa de Google. ¿Es posible o no? Probó muchas cosas pero fue no funciona como en la función de clic dentro de CSS y en línea css funciona bien