JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;extension=.js"></script>
<script src="https://rawgithub.com/HPNeo/gmaps/master/gmaps.js"></script>
Start Address:
<input type="text" id="Start" value="halifax, nova scotia" />
<br />End Address:
<input type="text" id="End" value="dartmouth, nova scotia" />
<br />
<div id="map"></div>
<p id="Time" />
<p id="Distance" />

CSS

#map {
     height: 500px;
     width: 500px;
 }

JavaScript

jQuery(document).ready(function () {
    var map;
    var latlng1;
    var latlng2;

    GMaps.geocode({
        address: $('#Start').val(),
        callback: function (results, status) {
            if (status == 'OK') {
                latlng1 = results[0].geometry.location;
                GMaps.geocode({
                    address: $('#End').val(),
                    callback: function (results, status) {
                        if (status == 'OK') {
                            latlng2 = results[0].geometry.location;
                            map = new GMaps({
                                div: '#map',
                                lat: latlng1.lat(),
                                lng: latlng1.lng(),
                                zoom: 12
                            });

                            map.drawRoute({
                                origin: [latlng1.lat(), latlng1.lng()],
                                destination: [latlng2.lat(), latlng2.lng()],
                                travelMode: 'driving',
                                strokeColor: '#131540',
                                strokeOpacity: 0.6,
                                strokeWeight: 6
                            });
                            map.getRoutes({
                                origin: [latlng1.lat(), latlng1.lng()],
                                destination: [latlng2.lat(), latlng2.lng()],
                                callback: function (e) {
                                    var time = 0;
                                    var distance = 0;
                                    for (var i=0; i<e[0].legs.length; i++) {
                                        time += e[0].legs[i].duration.value;
                                        distance += e[0].legs[i].distance.value;
                                    }
                                    $('p#Time').text(time+' Seconds');
                                   ...