var tilesdir = 'tiles/'; var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { var config = JSON.parse(xmlhttp.responseText); loadmap(config); } } xmlhttp.open("GET", tilesdir + "conf.json", true); xmlhttp.overrideMimeType("application/json"); //to silence browser warnings when started without a server xmlhttp.send(); function loadmap(config) { var mapsize = config.mapsize; var spawn = config.spawn; var zoommin = config.zoommin; var tilesize = config.tilesize; var xb= 0-spawn.x+mapsize/2; var yb= 0-spawn.y-mapsize/2-tilesize; var bnd = new L.LatLngBounds(); bnd.extend(L.latLng([spawn.x-mapsize/2, spawn.y-mapsize/2])); bnd.extend(L.latLng([spawn.x+mapsize/2, spawn.y+mapsize/2])); var map = L.map('map', { maxZoom:26, minZoom:zoommin, maxNativeZoom:20, fullscreenControl: true, //maxBounds: bnd, //commented out until it works... crs: /*L.CRS.Simple*/L.extend({}, L.CRS, { projection: { project: function (latlng) { return new L.Point(latlng.lat+xb, latlng.lng+yb); }, unproject: function (point) { return new L.LatLng(point.x-xb, point.y-yb); } }, transformation: new L.Transformation(1, 0, -1, 0), scale: function (zoom) { return Math.pow(2, zoom-20); } }) }).setView([0,0], 22); map.setView([spawn.x,spawn.y]); L.tileLayer(tilesdir + '{z}/map_{x}_{y}.png', { maxZoom: 26, maxNativeZoom: 20, tileSize: tilesize, continuousWorld: true }).addTo(map); map.on('mousemove click', function(e) { window.mousemove.innerHTML = e.latlng.lat.toFixed(1) + ', ' + e.latlng.lng.toFixed(1); }); var hash = L.hash(map); }