/* location.html*/
#map-canvas{ height:400px; width:700px; border:2px solid red; } <my-maps id ="map-canvas"></my-maps>
</ion-content>
</ion-view>
</body>
/*location.html ends here */
/* locate.js */
var myApp = angular.module(“locateApp”,[]);
myApp.directive(“myMaps”,function(){
debugger;
return{
restrict :‘E’,
template: ‘
replace : true,
link: function(scope, element, attrs){
var myLatLng = new google.maps.LatLng(17.5012901,78.3230196);
var mapOptions ={
center : myLatLng,
zoom:16,
mayTypeId: google.maps.MapTypeId.SATELLITE
};
var map = new google.maps.Map(document.getElementById(attrs.id),mapOptions);
var marker = new google.maps.Marker({
position:myLatLng,
map:map,
title:“My Town”
});
marker.setMap(map);
}
};
});
/*locate.js ends here */