How to style Info Window

[veso266]

Hi I would like to know how can I style Info Window I declare Info Window like this: <info-window id="iw" class="stil"> <div *ngIf="marker.display" class="test"> <h1 class="temperatura"><i class="wi wi-yahoo-{{Vreme}}" aria-hidden="true"></i><span class="stopinje"> {{vremePodatki}}&deg;C</span></h1> <h3 class="lokacija"><i class="fa fa-map-marker"> {{cc}}</i></h3> </div> </info-window>

and then I was trying to costumize iz with this tutorial: http://en.marnoto.com/2014/09/5-formas-de-personalizar-infowindow.html

but when I try .gm-style-iw width: 350px !important; top: 0 !important; left: 0 !important; border-radius: 2px 2px 0 0; }

Nothing happens the only was I was able to style inside of Info Window was to declare <div *ngIf="marker.display" class="test">` and then style that test class but it only changes inside not outside for example see this: https://test-c0c84.firebaseapp.com/vreme (when you click on a marker you can see that only inside is costumized

Thanks for Help and Best Regards

[drnuke-uk]

The original version of this plugin added the class ".ng-map-info-window" to the outer div of the info windows. That seems to be missing in this ng2 version.

i.e. var infoWindowContainerEl = infoWindow.content.parentElement.parentElement.parentElement; infoWindowContainerEl.className = "ng-map-info-window";

How can this be enabled in this version?

[shyamal890]

+1

[g-schmitz]

You can use the .gm-style .gm-style-iw class and its children for styling InfoWindow. But be careful not to put this CSS into the component's CSS file in which the map itself is used. That didnt work at all for me. Instead, use the general style.css (in case you are using angular cli).