JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>
<div id="map-canvas"></div>

CSS

html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }

JavaScript

function initialize() {
  var mapOptions = {
    zoom: 4,
    center: new google.maps.LatLng(-25.363882, 131.044922)
  };

  var map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  var marker = new google.maps.Marker({
    position: map.getCenter(),
    icon: {
    path: 'M 125,5 155,90 245,90 175,145 200,230 125,180 50,230 75,145 5,90 95,90 z',
    fillColor: 'yellow',
    fillOpacity: 0.8,
    scale: .5,
    strokeColor: 'gold',
    strokeWeight: 14
  },
    draggable: true,
    map: map
  });
  google.maps.event.addListener(marker,'mouseover',function(){
    this.getIcon().fillColor='red';
    this.setIcon(this.getIcon());
  });
  google.maps.event.addListener(marker,'mouseout',(function(marker){
    var fillColor=marker.getIcon().fillColor;
    return function(){
    this.getIcon().fillColor=fillColor;
    this.setIcon(this.getIcon());
  }})(marker));

}

google.maps.event.addDomListener(window, 'load', initialize);