JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry,places&amp;ext=.js"></script>
<label>raw poly</label>
<input id="rawbtn" type="checkbox" checked="checked" />
<label>simplified poly</label>
<input id="simplebtn" type="checkbox" checked="checked" />
<label>snapped poly</label>
<input id="snapbtn" type="checkbox" checked="checked" />
<div id="info"></div>
<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"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var bounds = new google.maps.LatLngBounds();
  var rawPolyline = new google.maps.Polyline({
    path: rawData,
    strokeColor: "#FF0000",
    strokeOpacity: 0.7,
    map: map
  });
  var path = [];
  document.getElementById('info').innerHTML += "raw length="+rawData.length+"<br>";
document.getElementById('info').innerHTML += "simplified length="+simplifiedPoints.length+"<br>";
  for (var i = 0; i < simplifiedPoints.length; i++) {
    var pt = new google.maps.LatLng(simplifiedPoints[i].lat, simplifiedPoints[i].lng)
    path.push(pt);
    bounds.extend(pt);
  }
  var simplifiedPolyline = new google.maps.Polyline({
    path: path,
    strokeColor: "#0000FF",
    strokeOpacity: 0.5,
    strokeWeight: 2,
    map: map
  });
  path = [];
  for (var i = 0; i < snappedPoints.length; i++) {
    path.push(new google.maps.LatLng(snappedPoints[i].lat, snappedPoints[i].lng));
  }
  document.getElementById('info').innerHTML += "snapped length="+snappedPoints.length+"<br>";  
  var snappedPolyline = new google.maps.Polyline({
    path: path,
    strokeColor: "#000000",
    strokeOpacity: 1.0,
    strokeWeight: 1,
    map: map
  });
  map.fitBounds(bounds);
  google.maps.event.addDomListener(document.getElementById('rawbtn'), 'click', function(btn) {
    if (document.getElementById('rawbtn').checked) {
      rawPolyline.setMap(map);
    } else {
      rawPolyline.setMap(null);
    }
  });
  google.maps.event.addDomListener(document.getElementById('simplebtn'), 'click', function(btn) {
    if (document.getElementById('simplebtn').checked) {
      simplifiedPolyline.setMap(map);
    } else {
      simplifiedPolyline.setMap(null);
    }
  });
  google.maps.event.addDomListener(document.getElementById('snapbtn'), 'click',...