JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3&amp;libraries=geometry"></script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/routeboxer/src/RouteBoxer.js"></script>
<div id="info"></div>
<div id="map-canvas"></div>

CSS

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

JavaScript

function init() {
          var mapDiv = document.getElementById('map-canvas');
          var map = new google.maps.Map(mapDiv, {
              center: new google.maps.LatLng(37.790234970864, -122.39031314844),
              zoom: 8,
              mapTypeId: google.maps.MapTypeId.ROADMAP
          });
          var distanceWidget = new DistanceWidget(map);
          google.maps.event.addListener(distanceWidget, 'distance_changed', function () {
              displayInfo(distanceWidget);
          });

          google.maps.event.addListener(distanceWidget, 'position_changed', function () {
              displayInfo(distanceWidget);
          });
      }

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

      /** 
       * A distance widget that will display a circle that can be resized and will 
       * provide the radius in km. 
       * 
       * @param {google.maps.Map} map The map on which to attach the distance widget. 
       * 
       * @constructor 
       */
      function DistanceWidget(map) {
          this.set('map', map);
          this.set('position', map.getCenter());

          var marker = new google.maps.Marker({
              draggable: true,
              icon: {
                  url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle_blue.png",
                  size: new google.maps.Size(7, 7),
                  anchor: new google.maps.Point(4, 4)
              },
              title: 'Move me!'
          });

          // Bind the marker map property to the DistanceWidget map property 
          marker.bindTo('map', this);

          // Bind the marker position property to the DistanceWidget position 
          // property 
          marker.bindTo('position', this);

          // Create a new radius widget 
          var radiusWidget = new RadiusWidget();

          // Bind the radiusWidget map to the DistanceWidget map 
          radiusWidget.bindTo('map', this);

          // Bind the radiusWidget center to the...