Customize the google maps marker


To specify an icon, set the marker's icon property to the URL of an image. The Google Maps API will size the icon automatically.

var lat = data['results'][0]['geometry']['location']['lat'];
var lon = data['results'][0]['geometry']['location']['lng'];

var map;
function initialize(lat, lon) {

var mapOptions = {
zoom: 17,
center: new google.maps.LatLng(lat, lon)
map = new google.maps.Map(document.getElementById('map-canvas'),
var image = '../../img/maps.png';
var myLatlng = new google.maps.LatLng(lat, lon);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
icon: image,
title: address

google.maps.event.addDomListener(window, 'load', initialize(lat,lon));

The result :

If you get some problems, contact me at [email protected]