#Google Maps with InfoWindow

<html>
  <head>
                        <script type  ="text/javascript"  src="https://maps.googleapis.com/maps/api/js?key=YourKey">
                        </script>
     
 </head>

      <body>
         
          <div style="width:500px;height:500px;border:groove" id="mapDiv"></div>

             <script>

                    // This example displays a marker at the center of Australia.
                    // When the user clicks the marker, an info window opens.

                    var Mymap,Mymarker;
                    var infowindow = new google.maps.InfoWindow({});
                    var LatLng = {lat: -25.363, lng: 131.044};

                    initMap();

                    function initMap()
                    {
                    Mymap = new google.maps.Map(document.getElementById('mapDiv'), {
                    zoom: 4,
                    center: LatLng
                    });

                    Mymarker = new google.maps.Marker({
                    position: LatLng,
                    map: Mymap,
                    title: 'Title'
                    });

                    Mymarker.addListener('click',
                    function() {

                    infowindow.setContent("<b>Info Windo Popup</b>");

                    infowindow.open(Mymap, Mymarker);

                    });
                    }

            </script>
     
     
      </body>
       

</html>

0 Comments