JSFiddle - React, Tailwind, and code Playground

by akaimo

HTML

<body>
<center> 
<input id="pac-input" class="controls" type="text" placeholder="Indicate a city">
<div id="map" style="width: 90%; height: 800px;"></div>
</center>
</body>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>
    <script src="http://code.highcharts.com/highcharts.js"></script>

CSS

.controls {
        margin-top: 16px;
        border: 1px solid transparent;
        border-radius: 2px 0 0 2px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        height: 32px;
        outline: none;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
		margin-left:50px;
      }

      #pac-input {
        background-color: #fff;
        padding: 0 11px 0 13px;
        width: 400px;
        font-family: Roboto;
        font-size: 15px;
        font-weight: 300;
        text-overflow: ellipsis;
		margin-left:50px;
      }

      #pac-input:focus {
        border-color: #4d90fe;
        margin-left: -1px;
        padding-left: 14px;
        width: 401px;
		margin-left:50px;
      }

JavaScript

$(document).ready(function() {
    var locations = [['The Manhattan at Times Square Hotel', 4, 40.762,-73.9826],['The Regency Hotel', 4, 51.4925,-0.178463],['Sheraton Heathrow Hotel', 4, 51.4825,-0.480818],['Sheraton New York Times Square Hotel', 4, 40.7626,-73.9821],['Hilton Meadowlands', 4, 40.8064,-74.0769],['Melia White House Hotel', 4, 51.5247,-0.143892],['Lancaster London', 4, 51.5125,-0.174934],['Millennium Gloucester Hotel London Kensington', 4, 51.4932,-0.182924],['ONE UN New York', 4, 40.7505,-73.9698],['Grand Hyatt New York', 4, 40.7517,-73.9766],['The May Fair', 5, 51.508,-0.143702],['Millennium Hotel London Mayfair', 4, 51.5109,-0.1511],['Marriott London Grosvenor Square', 4, 51.5128,-0.150782],['Saddle Brook Marriott', 4, 40.9042,-74.1014],['Ramada Rochelle Park', 2, 40.9186,-74.0851],['La Quinta Inn & Suites Clifton/Rutherford', 3, 40.8277,-74.1343],['London Marriott Hotel Regents Park', 4, 51.5418,-0.170764],['Holiday Inn London Mayfair', 4, 51.5077,-0.142684],['Crowne Plaza London - Kensington', 4, 51.495,-0.183401],['Marriott London Marble Arch', 4, 51.5164,-0.164073],['Holiday Inn Saddle Brook', 3, 40.9068,-74.0978],['DoubleTree by Hilton Fort Lee - George Washington Bridge', 4, 40.8605,-73.9759],['Howard Johnson Inn Clifton', 2, 40.8352,-74.15],['Park Central New York', 4, 40.7645,-73.9808],['The New York Palace', 5, 40.7582,-73.9745],['Omni Berkshire Place', 5, 40.7593,-73.975],['Holiday Inn New York City-Midtown-57th Street', 3, 40.7685,-73.9872],['The Lexington New York City, Autograph Collection', 4, 40.7551,-73.9734],['Salisbury Hotel', 3, 40.7648,-73.9784],['Wellington Hotel', 3, 40.7645,-73.9808],['St. James\' Court, A Taj Hotel, London', 4, 51.4988,-0.137396],['New York Hilton Midtown', 4, 40.7622,-73.9787],['The Waldorf Astoria New York', 5, 40.7566,-73.9743],['Hilton Newark Penn Station', 4, 40.7357,-74.165],['Novotel New York - Times Square', 4, 40.7629,-73.9836],['Britannia The International Hotel London, Canary Wharf', 4,...