Google Map Integration Add InfoWindow in Marker

Many Web application show the locations on Google map like list of Hotels, Hostels, Origin & Destination in form of marker. 

When we click on these markers a small popup window open, that describe about that location. Its very useful functionality of Google map because we can can't show the address in Google map but we can show the Marker in Google map. 

We can show lot of markers with different categories and also these markers can be customized, means we can show our custom image instead of Google Marker. Also can do lot of animation with marker.

We can add rich text in the info popup window. means you can do bold, italic, text align and add images. You can put full address with images in the info box.

<script src="//maps.google.com/maps/api/js?sensor=true"></script>
<script>
    /** Add lat/lng of your location **/
    var myCenter3=new google.maps.LatLng(51.508742,-0.120850);

    function initialize3()
    {
        var mapProp3 = {
            center:myCenter3,
            zoom:5,
            mapTypeId:google.maps.MapTypeId.ROADMAP
        };

        var map3=new google.maps.Map(document.getElementById("googleMapId3"),mapProp3);

        var marker3=new google.maps.Marker({
            position:myCenter3
        });

        marker3.setMap(map3);

        var infowindow = new google.maps.InfoWindow({
            content:"We are <b>web technology experts</b>, You can also add images here."
        });
        
        infowindow.open(map3,marker3);
    }
    google.maps.event.addDomListener(window, 'load', initialize3);
</script>
<div id="googleMapId3" style="height: 300px; width: 650px;">
</div>

Best Related Posts are Following:

1. How can I check whether Google Maps is fully loaded in GMaps v3.
2. Goole Map - Track your moving Position on google map- html5.
3. Google Maps - Modifying Controls.
4. Google Map Integration Add InfoWindow in Marker.
5. Google Map - Add a marker.
6. Google map integration.