var HelloWorld_<ID>_module = angular.module(..... .

HelloWorld_<ID>_module.directive('googlemaps', function() {
return {
restrict: 'E',
//Restrict to HTML Tags only
replace: true,
//Replace existing content with the content from this directive
template: '<div></div>',
//Base Template for the tag
link: function($scope, element, attrs) {
//This function is invoke when the directive get linked to the DOM
var center = new google.maps.LatLng(50.1, 14.4);
//Taking a randon centre point in Map
var map_options = {
// Default Options for Maps
zoom : 2,
mapTypeId : google.maps.MapTypeId.ROADMAP,
center : center,
};

// Create a Map Object
var map = new google.maps.Map(document.getElementById
(attrs.id), map_options);
// Create a Marker Array. Each marker will correspond to a point in the map
$scope.markers = [];

//Function to be invoke from controller. This takes a an array of location
objects and points each location on the map

// a typical locations array would be something like this
[{"location":"Bangalore"},{"location":"Seattle"},{"location":"Reston"}]
$scope.locateInMap= function(locations){
$scope.hideMarkers();
// Hide existing markers and plot new ones
geocoder = new google.maps.Geocoder();
for(var key in locations){
if(locations.hasOwnProperty(key)){
geocoder.geocode({
'address' : locations[key].location
// Decode the location string to a specific geocode
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK)
{
//In this case it creates a marker, but you can get the lat and lng from
the location.LatLng
map.setCenter(results[0].geometry.
location);
var marker = new google.maps.Marker({
map : map,
position : results[0].geometry.
location
});
$scope.markers.push(marker);
} else {
alert("Geocode was not successful for the
following reason: " + status);
}
});
}
}

};
$scope.hideMarkers=function() {
/* Remove All Markers from the Map*/
while($scope.markers.length){
$scope.markers.pop().setMap(null);
}
}

window.setTimeout(function() {
google.maps.event.trigger(map, 'resize');
}, 100);

}
}
});