JSFiddle - React, Tailwind, and code Playground

by ryanttb

HTML

<script src="http://jquerygeo.com/test/jquery.geo-test.min.js"></script>
<div id="map"></div>

CSS

html { height: 100% }
      body { height: 100%; margin: 0; padding: 0;font-family: Verdana,Arial,sans-serif;font-size: .9em; }
      #map{ height: 100% }

JavaScript

var m = $("#map").geomap({
        center: [-71.0595678, 42.3604823],
        zoom: 8,
        services: [ {
            id: "osm-string-src",
            type: "tiled",
            src: function (view) {
                return "http://otile" + ((view.index % 4) + 1) + ".mqcdn.com/tiles/1.0.0/osm/"+ view.zoom + "/" + view.tile.column + "/" + view.tile.row + ".png";
            },
        attr: "Tiles Courtesy of <a href='http://www.mapquest.com/' target='_blank'>MapQuest</a> <img src='http://developer.mapquest.com/content/osm/mq_logo.png'>"} ]
      });
    $.get("http://oa-otp.rhcloud.com/oag.jsonp",function(data){
        m.geomap("append",data);
    },"JSONP");