JSFiddle - React, Tailwind, and code Playground

by kosmos

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
<div id="map"></div>

CSS

#map { width: 300px; height: 300px; }

JavaScript

window.onload = function(){
    var map = new google.maps.Map(document.getElementById('map'), { 
        center: new google.maps.LatLng(22.669, 77.709),
        zoom: 5,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var content="<div class='info_content' id='info01' tabindex='1'>hello world</div>";
    var infowindow = new google.maps.InfoWindow();
    
    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(22.669, 77.709),
        map: map
    });
    
    google.maps.event.addListener(marker, 'mouseover', function(){
        infowindow.setContent(content);
        infowindow.open(map, marker);
    });
    
    google.maps.event.addListener(marker, 'mouseout', function(){
        //
    });
    
    google.maps.event.addListener(infowindow, 'domready', function(){
        $('#info01').focus();
    });

};