2

I use Google Maps for AngularJS to put some markers with infoWindow. It can open infoWindow when a marker is clicked. But it cannot close the opened infoWindow when another marker is clicked.

<div id="map" ng-controller="MapCtrl">
    <google-map 
        center="map.center" 
        zoom="map.zoom" 
        draggable="true" 
        dragging="map.dragging" 
        events="map.events" 
        control="map.control" 
        refresh="true">
        <markers models="map.markers" coords="'self'" icon="'icon'" click="'onClicked'">
      <windows show="'showWindow'" closeClick="'closeClick'" ng-cloak>
        <img ng-non-bindable src="{{url}}" width="200px;" class="img-responsive" />
      </windows>
        </markers>
    </google-map>
</div>

Here is the controller.js

var mapControllers = angular.module('mapControllers', ['google-maps']);

mapControllers.controller('MapCtrl', function($scope, $http) {
var onMarkerClicked = function (marker) {
    _.each($scope.map.markers, function (mker) {
    mker.showWindow = false;
});
$scope.$apply();
  marker.showWindow = true;
};

$scope.map = {
    current_marker: {},
    control:{},
    markers: [],
center: {
    latitude: 35.4138,
    longitude: 139.4505
},
zoom: 6,
dragging: true
};

$http.get('/v1/tweets').success(function(data) {
    for (var i = 0; i < data.length; i++) {
        var marker = { 
        latitude: data[i].lat, 
        longitude: data[i].lon, 
        text: data[i].text, 
        url: data[i].url, 
        icon: '/assets/flower.png',
        showWindow: false
    };
    marker.closeClick = function () {
      marker.showWindow = false;
      $scope.$apply();
      };
      marker.onClicked = function () {
        onMarkerClicked(marker);
      };
    $scope.map.markers.push(marker);
  }
});
});

How can I change this code ?

jwako
  • 173
  • 2
  • 12
  • 1
    I got a working version but I used the single object directives along with ng-repeat http://plnkr.co/edit/AVKxRDn3xKtt2Q3jodWC?p=preview – JoseM Apr 04 '14 at 19:44
  • solution for your question http://stackoverflow.com/questions/19067027/close-all-info-windows-google-maps-api-v3 – vinod_vh Apr 04 '14 at 20:38
  • Hi JoseM, I could close infoWIndows! Thank you very much. – jwako Apr 04 '14 at 22:00
  • 1
    @vinod_vh How does that answer the question? Your question related to native Google Maps API and this question is about `angular-google-maps` directive. – Robin van Baalen Jan 29 '15 at 15:58

1 Answers1

-1

Dirty hack with jQuery:

$("img[src='https://maps.gstatic.com/mapfiles/api-3/images/mapcnt3.png']").click();

Close/click all open windows before showing new Infowindow.

Edward Olamisan
  • 800
  • 1
  • 18
  • 28