I would like to learn how to display a Google map with some custom markers using ngcordova angularjs but no ionic framework.
Could you point me to a comprehensive tutorial for beginners (no missing steps) that explains how to do it, please?
Thank you very much
You have several alternatives:
you can simply use an Angular module such as ngMap, and in this case you don't need a tutorial but their documentation. There you can find all kind of example.
you can adopt a Cordova Plugin like cordova-plugin-googlemaps which has a specific tutorial in the documentation
search also here on SO for example: angular-js-and-google-maps
its work in app as well as browser. 1. add google map script in in index.html
<script type="text/javascript" src="http://maps.google.com/maps/api/js">
</script>
in html side
< div align = "center" > < div id = "map" style = "width:100%;height:200px" > < /div> < /div>
3 in script side
var latlng = {
lat: 12.34343,
lng: 34.12313
};
var map;
function initMap(latlng) {
var map = new google.maps.Map(document.getElementById('map'), {
center: latlng,
scrollwheel: false,
zoom: 14,
dragging: false,
scrollwheel: false,
draggable: false,
zoomControl: false,
disableDoubleClickZoom: true,
keyboardShortcuts: false,
panControl: false,
streetViewControl: false,
disableDefaultUI: false
});
var cityCircle = new google.maps.Circle({
strokeColor: '#F2F2F2',
strokeOpacity: 0.7,
strokeWeight: 2,
fillColor: '#0DCCC0',
fillOpacity: 0.7,
map: map,
center: latlng,
radius: Math.sqrt(5) * 100
});
}
4. call initMap(latlng)
its work fine in my app and browser. and best benefit its design on marker. just like a Circle.
