JSFiddle - React, Tailwind, and code Playground

by Sebastian Kay

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.3/leaflet.css">
<div id="map">

</div>

CSS

#map {
  height: 400px;
}

JavaScript

(function () {
	var b = 0.5859375 / 9,
		c = L.latLng([0, 0]);
	L.CRS.ChernarusPlusSatellite = L.Util.extend({}, L.CRS, {
		latLngToPoint: function (e, d) {
			var a = L.latLng([e.lat - c.lat, e.lng - c.lng]),
				a = this.projection.project(a),
				b = this.scale(d);
			return a = this.transformation._transform(a, b)
		},
		pointToLatLng: function (b, d) {
			var a = this.scale(d),
				a = this.transformation.untransform(b, a),
				a = this.projection.unproject(a);
			a.lat += c.lat;
			a.lng += c.lng;
			return a
		},
		projection: L.Projection.LonLat,
		transformation: new L.Transformation(b, 0, b, 0)
	})
})();
var dayzMapTypes = [{
		center: [11.8, 10],
		zoom: 4,
		minZoom: 2,
		maxZoom: 6,
		grid: {
			2: 1,
			3: 1,
			4: 0.5,
			5: 0.5,
			6: 0.1,
			7: 0.1,
			strokeStyle: "rgba(60,90,120,0.85)",
			limit: [0, 15.36]
		},
		layers: [L.tileLayer("http://www.dayztv.com/map/static/tiles/chernarusplus/{z}/{x}_{y}.jpg?4", {
			noWrap: !0,
		})],
		markerZoomAnimation: !1,
		attributionControl: !1,
		crs: L.CRS.ChernarusPlusSatellite
	}],
	dayzMapNames = ["Chernarus+ (Satellite)"],
	dayzProjections = [L.CRS.ChernarusPlusSatellite],
	dayzProjection = dayzProjections[0];
$(document).ready(function () {
	dzMap.init(1)
});

var dzMap = new function() {
  var a = this;
  a.buildings = [];
  a.markers = [];
  a.loadedSets = {};
  a.shownSets = {};
  a.mapId = 0;
  a.mapType = -1;
  a.map = null;
  a.canvas = null;
  a.projection = null;
  var e = !1,
    k = !1,
    p = [],
    l = function(a) {
      if (localStorage) return localStorage[a]
    };
  a.onLoaded = function() {
    if (e) {
      k = !1;
      var b = a.buildings,
        d = a.markers,
        c;
      a.canvas.setAutoRedraw(!1);
      var f = b.length;
      for (c = 0; c < f; ++c) dzMarkers.addBuilding(b[c].id, b[c].lat, b[c].lng, b[c].t, b[c].s, b[c].b);
      b = d.length;
      for (c = 0; c < b; ++c) dzMarkers.addMarker(0, d[c].id, d[c].lat, d[c].lng, d[c].t, d[c].i, d[c].n, d[c].b);
     ...