From 9a9955601e5d03c2c07591721715bac37ab9fba9 Mon Sep 17 00:00:00 2001 From: est31 Date: Sat, 21 Feb 2015 01:03:49 +0100 Subject: [PATCH] html improvements Improvements: -fix position bug -display position of mouse pointer -enable higher zoom in --- www/leaflet-custom.css | 19 ++++++++++++++++++- www/map.html | 7 ++++++- www/map.js | 9 ++++++--- 3 files changed, 30 insertions(+), 5 deletions(-) diff --git a/www/leaflet-custom.css b/www/leaflet-custom.css index 46d57e7..b0d2be4 100644 --- a/www/leaflet-custom.css +++ b/www/leaflet-custom.css @@ -1,7 +1,24 @@ -#map { +#mapcontainer { width: 98%; height: 98%; margin: 1% 1% 1% 1%; image-rendering: -moz-crisp-edges; /* firefox */ image-rendering: pixelated; /* hopefully everyone eventually */ +} + +#map { + width: 100%; + height: 100%; + image-rendering: -moz-crisp-edges; /* firefox */ + image-rendering: pixelated; /* hopefully everyone eventually */ } + +#info { + background:#fff; + position:absolute; + top:calc(10px + 1%); + right:calc(10px + 1%); + padding:10px; + z-index:100; + border-radius:3px; +} \ No newline at end of file diff --git a/www/map.html b/www/map.html index af877cb..fe08793 100644 --- a/www/map.html +++ b/www/map.html @@ -7,7 +7,12 @@ -
+
+
+ Position: +
+
+
\ No newline at end of file diff --git a/www/map.js b/www/map.js index 29d0694..8d66d67 100644 --- a/www/map.js +++ b/www/map.js @@ -14,12 +14,12 @@ function loadmap(config) { var spawn = config.spawn; var zoommin = config.zoommin; var xb= 0-spawn.x+mapsize/2; - var yb= 0-spawn.y-mapsize/2; + var yb= 0-spawn.y-mapsize/2-256; 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:24, + maxZoom:26, minZoom:zoommin, maxNativeZoom:20, fullscreenControl: true, @@ -42,11 +42,14 @@ function loadmap(config) { }).setView([0,0], 22); map.setView([spawn.x,spawn.y]); L.tileLayer('tiles/{z}/map_{x}_{y}.png', { - maxZoom: 24, + maxZoom: 26, maxNativeZoom: 20, tileSize: 256, 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); }