I'm using Allenhwkim's wonderful ngMap in a project. I know that I need to use Maps Javascript v3 API to manipulate the map, which is going well except that I can't get any event listeners, e.g., $google.maps.event.addListener(markers[i], 'click', function()...
to work
Specifically, I'm trying to create an onClick event on my markers. Here's an example: http://plnkr.co/edit/HAcEfWl5LR9SGGqbcXcW?p=preview
Here, I try to use an ng-click attribute on a marker directive. Still, I get nothing. http://plnkr.co/edit/FqwNhqEgDe75il8nU0sC?p=preview
You can use ngMap's specific UI event methods.
Check out this documentation: https://ngmap.github.io/events.html#/event-simple#event-simple
also sample code:
HTML:
<div ng-controller="EventSimpleCtrl" class="ng-scope">
<map zoom="4" center="-25.363882, 131.044922" on-center-changed="centerChanged()">
<marker position="-25.363882, 131.044922" on-click="click()" title="Click to zoom"></marker>
</map>
</div>
JavaScript:
$scope.click = function(event) {
map.setZoom(8);
map.setCenter(marker.getPosition());
}
Sample code link: http://plnkr.co/edit/mli6jTMwGE9k35GFPZT9?p=preview
Edit:
You can use google.maps.event.addListener
, but you need to create variables to hold your marker, and add the listeners to the markers.
You can change the code in your script.js to the following:
var app = angular.module('myApp', ['ngMap']);
app.controller('mapController', function($scope, $http, $interval) {
var map;
$scope.dynMarkers = [];
$scope.$on('mapInitialized', function(event, evtMap) {
map = evtMap;
for (var i=0; i<1000; i++) {
var latLng = new google.maps.LatLng(markers[i].position[0], markers[i].position[1]);
var marker = new google.maps.Marker({position:latLng});
$scope.dynMarkers.push(marker);
google.maps.event.addListener(marker, 'click', function() {
alert("this is marker " + i);
});
}
$scope.markerClusterer = new MarkerClusterer(map, $scope.dynMarkers, {});
});
});
Notice this line var marker = new google.maps.Marker({position:latLng});
You can try in this link: http://plnkr.co/edit/LiblBBvauGnn67xOy96D?p=preview