JSFiddle - React, Tailwind, and code Playground

by Lawrence Ross

HTML

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry,places&amp;ext=.js"></script>
<div id="map_canvas"></div>

CSS

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

JavaScript

var geocoder;
var map;

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      zoom: 4,
      center: {
        lat: -28,
        lng: 137
      },
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  // map.data.addGeoJson(geoJson);
  map.data.loadGeoJson(
    'https://api.myjson.com/bins/1teyu', {},
    function(features) {
      console.log(map.data.getFeatureById("1"));
      console.log(map.data.getFeatureById("1").getProperty("letter"));
    });
}
google.maps.event.addDomListener(window, "load", initialize);