Search code examples
angularjsgoogle-mapsgoogle-maps-api-3ng-map

How to auto open Infowindow on marker on NgMap load?


How to auto open infowindow on marker on NgMap load ?

Here is my code:

<map  center="{{lat}},{{lng}}"   zoom="10" >
   <marker id="mymarker" position="{{lat}},{{lng}}"></marker>
   <info-window id="bar"> <b>Hello World!</b></info-window>
</map> 

Any onload events to use?


Solution

  • This is an idea for you to tailor it to your problem // review the example

    NgMap.getMap({id:"map"}) -> Returns a promise, and the function then executes the code after that map is loaded

    angular.module('ngMap').controller('MyCtrl', function(NgMap) {
      NgMap.getMap({id:"map"}).then(function(map) {       
        map.showInfoWindow('bar', 'marker1');
      });
    });
    
    <ng-map id="map" default-style="true" center="-25.363882,131.044922" zoom="4">
          <marker id="marker1" position="-25.363882,131.044922"
            on-click="map.showInfoWindow('bar')">
          </marker>
          <info-window id="bar">
            <div ng-non-bindable>
              Bla bla
            </div>
          </info-window>
    </ng-map>
    

    Example plunk AutoLoad infowindow