Add custom marker to Google map

<script src=""></script>	<!-- Google Maps API -->
	var map;	// Google map object
	// Initialize and display a google map
	function Init()
		// Create a Google coordinate object for where to center the map
		var latlngDC = new google.maps.LatLng( 38.8951, -77.0367 );	// Coordinates of Washington, DC (area centroid)
		// Map options for how to display the Google map
		var mapOptions = { zoom: 12, center: latlngDC  };
		// Show the Google map in the div with the attribute id 'map-canvas'.
		map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
		// Place a standard Google Marker at the same location as the map center (Washington, DC)
		// When you hover over the marker, it will display the title
		var marker = new google.maps.Marker( { 
			position: latlngDC,     
			map: map,      
			title: 'Washington, DC',
			icon : 'bigcity.png',					// image to display as the marker
			animation: google.maps.Animation.BOUNCE	// set marker to bounce
	// Call the method 'Init()' to display the google map when the web page is displayed ( load event )
	google.maps.event.addDomListener( window, 'load', Init );

	/* style settings for Google map */
		width : 500px; 	/* map width */
		height: 500px;	/* map height */
	<!-- Dislay Google map here -->
	<div id='map-canvas' ></div>

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s