Custom image as a pin: Google maps

The script below adds your own custom image say logo as a location pin in the google maps. The default google-map pin will be replace by the image you’ve provided the full path in the below script on variable ‘image’:

#script

<script type=”text/javascript” src=”http://maps.googleapis.com/maps/api/js?v=3&sensor=false&callback=initialize”></script>

<script type=”text/javascript”>
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(abc, xyz),   //[Latitude, Longitude]
zoom: 14,
zoomControl: true,
draggable: true,
mapTypeControl: false,
streetViewControl: false,
overviewMapControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById(“map-canvas”),
mapOptions);
var image = “Logo-pin.png”; //[Image path]
var myLatLng = new google.maps.LatLng(abc, xyz); //[Latitude, Longitude]
var beachMarker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
}
google.maps.event.addDomListener(window, ‘load’, initialize);
</script>

Leave comment

Your email address will not be published. Required fields are marked with *.