JSFiddle - React, Tailwind, and code Playground

by salitrapraveen

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false&amp;.js"></script>
<!-- the Google Map will be displayed here -->
<div id="google_map">
</div>

<!-- this section will be used for logging purpose -->
<section id="console">  
</section>

CSS

#google_map {
    width: 90%;
    height: 300px;
    margin: 20px auto;
}

#console {
    width: 90%;
    background-color: #fff;
    color: #222;
    font-family: monospace;
    font-size: 12px;
    margin: auto;
}

JavaScript

/*
 * Author: Massimiliano Marcon
 * Date: 04/19/2011
 */

var MYAPP = {
    map: null, //can be useful to save a reference to the Google Map object
    data: { //the definition of the points of interest that have to be displayed
        'banks': [
            {
                lat: 29.14505,
                lng: -82.189993
            },
            {
                lat: 29.653236,
                lng: -82.422619
            }
        ],
        'universities': [
            {
                lat: 29.679888,
                lng: -82.430461
            }
        ],
        'power companies': [
            {
                lat: 29.203575,
                lng: -81.039404
            },
            {
                lat: 28.538235,
                lng: -81.377389
            }
        ]
    },
    log: function (message) {
        //The code to display log messages in the logging area should go here
    },
    google_init: function (centerLat, centerLng) {
        //The code to initialize a Google Map centered in centerLat, centerLng
        //should go here
    },
    google_pin_point_location: function (lat, lng, category) {
        //The code to add a pin to the map in the point
        //identified by (lat, lng) should go here.
        //Category may be used for displaying additional information
        //about the point of interest in the bubble
    }
};

$(function(){
    //Functions and variable that are
    //Included within MYAPP can be called from here.
    //e.g. MYAPP.data
});