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

var overlay;
USGSOverlay.prototype = new google.maps.OverlayView();



function initialize() {
  var mapOptions = {
    zoom: 0,
    center: new google.maps.LatLng(0,180),
    mapTypeId: google.maps.MapTypeId.SATELLITE
  };

  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  //range for latitude is around -85 to 85
  var swBound = new google.maps.LatLng(-85,-180);
  var neBound = new google.maps.LatLng(85,180);
  
  var bounds = new google.maps.LatLngBounds(swBound, neBound);

  overlay = new USGSOverlay(bounds, map);
}

function USGSOverlay(bounds, map) {

  this.bounds_ = bounds;
  this.map_ = map;
  this.div_ = null;

  this.setMap(map);
}
USGSOverlay.prototype.onAdd = function() {

  var div = document.createElement('div');
  div.style.borderStyle = 'none';
  div.style.borderWidth = '0px';
  div.style.position = 'absolute';
  div.style.background='red';
  div.style.opacity=.5;
  this.div_ = div;
  var panes = this.getPanes();
  panes.overlayLayer.appendChild(div);
};
USGSOverlay.prototype.draw = function() {

  var overlayProjection = this.getProjection();
  var sw = overlayProjection.fromLatLngToDivPixel(this.bounds_.getSouthWest());
  var ne = overlayProjection.fromLatLngToDivPixel(this.bounds_.getNorthEast());
  var width=((ne.x - sw.x)
              +
              (((ne.x - sw.x)<0
                ||
              this.bounds_.getNorthEast().lng()
              -
              this.bounds_.getSouthWest().lng()>=360)?overlayProjection.getWorldWidth():0));
  var div = this.div_;
  div.style.left = sw.x + 'px';
  div.style.top = ne.y + 'px';

  div.style.width = width + 'px';
  div.style.height = (sw.y - ne.y) + 'px';

};

USGSOverlay.prototype.onRemove = function() {
  this.div_.parentNode.removeChild(this.div_);
  this.div_ = null;
};

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