JSFiddle - React, Tailwind, and code Playground

by joshmoto

JavaScript

//<![CDATA[
$(document).ready(function() {
  var max = 20;
  var min = 1;
  var nlsmap = new google.maps.ImageMapType({
    getTileUrl: function(tile, zoom) {
      return NLSTileUrlOS(tile.x, tile.y, zoom);
    },
    tileSize: new google.maps.Size(256, 256),
    isPng: false,
    maxZoom: max,
    minZoom: min,
    name: 'Historic',
    alt: "NLS Historic Map"
  });
  var imperium = new google.maps.ImageMapType({
    getTileUrl: function(coord, zoom) {
      return "http://finds.org.uk/imperium/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
    },
    tileSize: new google.maps.Size(256, 256),
    isPng: true,
    alt: "Imperium layer",
    name: "Imperium",
    maxZoom: 10,
    minZoom: 3
  });
  var osmMapType = new google.maps.ImageMapType({
    getTileUrl: function(coord, zoom) {
      return "https://a.tile.openstreetmap.org/" + zoom + "/" + coord.x + "/" + coord.y + ".png";
    },
    tileSize: new google.maps.Size(256, 256),
    isPng: true,
    alt: "OpenStreetMap layer",
    name: "OSM",
    maxZoom: max
  });
  var soilMapType = new google.maps.ImageMapType({
    getTileUrl: function(tile, zoom) {
      var projection = map.getProjection();
      var zpow = Math.pow(2, zoom);
      var ul = new google.maps.Point(tile.x * 256.0 / zpow, (tile.y + 1) * 256.0 / zpow);
      var lr = new google.maps.Point((tile.x + 1) * 256.0 / zpow, (tile.y) * 256.0 / zpow);
      var ulw = projection.fromPointToLatLng(ul);
      var lrw = projection.fromPointToLatLng(lr);
      var baseURL = "http://geonetwork3.fao.org/ows/14116?LAYERS=world_soilmap&TRANSPARENT=true&SERVICE=WMS&VERSION=1.1.1&REQUEST=GetMap&FORMAT=image/png&SRS=EPSG:4326";
      var version = "1.1.1";
      var request = "GetMap";
      var format = "image/png";
      var layers = "world_soilmap";
      var srs = "EPSG:4326";
      var bbox = ulw.lng() + "," + ulw.lat() + "," + lrw.lng() + "," + lrw.lat();
      var service = "WMS";
      var width = "256";
      var height = "256";
      var styles =...