Cutomize Google Map marker with Rounded shape
http://stackoverflow.com/questions/31087397/how-to-get-circle-markerimage-google-map-in-sencha-touch
HTML
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<div id="map-canvas"></div>
CSS
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
.gm-style img {
max-width: none;
border-radius: 25px !important;
}
JavaScript
function initialize() {
var mapOptions = {
zoom: 10,
center: new google.maps.LatLng(23.03451215900886, 72.56236218980784)
}
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
setMarkers(map, beaches);
}
var beaches = [
['Bondi Beach', 23.03451215900886, 72.56236218980784]
];
function setMarkers(map, locations) {
for (var i = 0; i < locations.length; i++) {
var beach = locations[i];
var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
var markerImage = new google.maps.MarkerImage(
'http://the99apps.com/dmindia/testimg.jpg'
);
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: markerImage,
optimized: false,
});
}
}
google.maps.event.addDomListener(window, 'load', initialize);