JSFiddle - React, Tailwind, and code Playground

by rarteaga

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;sensor=false"></script>
<script src="&quot;http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js"></script>
<script src="http://geoxml3.googlecode.com/svn/trunk/ProjectedOverlay.js"></script>
<div id="canvas" style="width:100%; height:500px"></div>

JavaScript

var geoXml = null;
var map = null;
var kmlLayerHI = null;
var myLatLng = null;

function initialize() {
    myLatLng = new google.maps.LatLng(37.422104808,-122.0838851);
    
    var options = {
        center: new google.maps.LatLng(37.422104808, -122.0838851),
        //zoom: 13,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    
    map = new google.maps.Map(document.getElementById("canvas"), options);
    
    kmlLayerHI = new google.maps.KmlLayer('http://www.geocodezip.com/geoxml3_test/us_states_HI.xml');
    kmlLayerHI.setMap(null);
    
    geoXml = new geoXML3.parser({map: map, singleInfoWindow: true});
    geoXml.parse('us_states_HI.xml');

};

function hide_geoxml_kml() {
    geoXml.hideDocument();      
}
function unhide_geoxml_kml() {  
    geoXml.showDocument();    
}
function geoxml2json(geoxml) {  
    console.log(JSON.stringify(geoxml.docs[0],null,2)); 
}
        
$(document).ready(function() {
    initialize();
});