Adding ID property to ng-map causes info-window to not open and vm.map to be undefined

[mtpultz]

Steps to reproduce and a minimal demo(Plunker Example)

Adding an id to the ng-map directive causes an issue with regards to at least the marker and info-window interactions. I figured this out after coming across a similar issue to #604, but the issue needed to be put into a issue format and not a question to push it towards resolution.

By replacing the class="mapDemo" with an id="mapDemo" on the ng-map directive in this plunker you'll see the info-window will no longer show up onload regardless of whether the visible-on-marker is applied or not to the info-window. Also, clicking the marker to reopen the info window when there is an id attribute causes vm.map to always be undefined.

As an aside, the info-window when the id is not present and you click the marker opens up directly on top of the marker, also seen in plunker demo.

Current behavior

• Once an id attribute is added to ng-map the info-window no longer shows up onload, and vm.map is always undefined inside of vm.showInfoWindow.

Expected/desired behavior

• Either document that an id shouldn't ever be applied to the ng-map directive, or allow it to be applied so marker related info windows function properly

[allenhwkim]

I really appreciate the detailed bug reporting that you made. I will take a look into it sooner than later.

[allenhwkim]

Please try this way,

With map with id, getMap() function also should be with Id. e.g. getMap('mapDemo')
Also, when open window, we need to have anchor of the marker as this

    angular.module('ngMap')
      .controller('demo', function(NgMap) {

        NgMap.getMap('mapDemo')
             .then(function(map) {
          vm.map = map;
        });

        var vm = this;

        vm.showInfoWindow = function() {
          vm.map.showInfoWindow('event-location-info', this);
        }
      });

[mtpultz]

Hi @allenhwkim, thanks for the reply that works for the info window appearing on click, and removes the undefined vm.map reference, but it still doesn't appear to display the info window onload when using visible-on-marker. I updated the plunker with your corrections.

[allenhwkim]

We need to refactor the following logic

angularjs-google-maps/directives/info-window.js

Line 193 in 7d57629

to check if getMap() returns a map. normally with id '0',

if not returns any, we need to get the first map, and use it to display an info window.

[NahidaHK]

Hello @allenhwkim

i need to show info window and i follow that's exactly steps and it doesn't work for me my app doesn't recognize info window directive , before adding this
<info-window id="distInfo" visible-on-marker="event-location"> <div ng-non-bindable> Hello </div> </info-window>

my app show maps and markers on it , But after adding even map doesn't work .

thnx

[ShaunDadi]

I have exactly the same issue with @NahidaHK . If I add the <info-window></info-window> directive, the map will not show. If I remove the <info-window></info-window> directive, the map shows again.

[NahidaHK]

@darkdadi
I was missing this property on ng-map tag
default-style="true"

it works now , try it

[ShaunDadi]

Thanks @NahidaHK . I'm gonna try it.

[allenhwkim]

This has been fixed with PR. Please reopen this if the issue continue