map position in url
Signed-off-by: K1 <git@karoh.net>
This commit is contained in:
parent
7783aeba29
commit
1bb6f70c92
1 changed files with 38 additions and 1 deletions
39
dve.js
39
dve.js
|
|
@ -9,6 +9,7 @@ const zoom = 14;
|
||||||
const mapCounts = [2, 4, 6, 9];
|
const mapCounts = [2, 4, 6, 9];
|
||||||
|
|
||||||
let syncing = false;
|
let syncing = false;
|
||||||
|
let urlUpdateTimer = null;
|
||||||
|
|
||||||
let TILE_SERVERS = [];
|
let TILE_SERVERS = [];
|
||||||
let maps = [];
|
let maps = [];
|
||||||
|
|
@ -23,6 +24,39 @@ function fillDropdown(select) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function readUrlPosition() {
|
||||||
|
const match = window.location.hash.match(/^#map=([0-9.]+)\/(-?[0-9.]+)\/(-?[0-9.]+)/);
|
||||||
|
|
||||||
|
if (match) {
|
||||||
|
const z = parseFloat(match[1]);
|
||||||
|
const lat = parseFloat(match[2]);
|
||||||
|
const lng = parseFloat(match[3]);
|
||||||
|
|
||||||
|
if (Number.isFinite(lat) && Number.isFinite(lng) && Number.isFinite(z)) {
|
||||||
|
return {
|
||||||
|
center: [lat, lng],
|
||||||
|
zoom: z
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
center,
|
||||||
|
zoom
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function writeUrlPosition(map) {
|
||||||
|
if (urlUpdateTimer) clearTimeout(urlUpdateTimer);
|
||||||
|
|
||||||
|
urlUpdateTimer = setTimeout(() => {
|
||||||
|
const c = map.getCenter();
|
||||||
|
const hash = "#map=" + map.getZoom() + "/" + c.lat.toFixed(5) + "/" + c.lng.toFixed(5);
|
||||||
|
|
||||||
|
history.replaceState(null, "", hash);
|
||||||
|
}, 100);
|
||||||
|
}
|
||||||
|
|
||||||
function sync(source) {
|
function sync(source) {
|
||||||
if (syncing) return;
|
if (syncing) return;
|
||||||
syncing = true;
|
syncing = true;
|
||||||
|
|
@ -32,6 +66,8 @@ function sync(source) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
syncing = false;
|
syncing = false;
|
||||||
|
|
||||||
|
writeUrlPosition(source);
|
||||||
}
|
}
|
||||||
|
|
||||||
function setLayer(map, config, currentLayer) {
|
function setLayer(map, config, currentLayer) {
|
||||||
|
|
@ -85,6 +121,7 @@ function setMapCount(count) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
|
const urlPosition = readUrlPosition();
|
||||||
const mapCountSelector = document.getElementById("mapCountSelector");
|
const mapCountSelector = document.getElementById("mapCountSelector");
|
||||||
fillMapCountDropdown(mapCountSelector);
|
fillMapCountDropdown(mapCountSelector);
|
||||||
|
|
||||||
|
|
@ -92,7 +129,7 @@ function init() {
|
||||||
const select = document.getElementById("select" + i);
|
const select = document.getElementById("select" + i);
|
||||||
fillDropdown(select);
|
fillDropdown(select);
|
||||||
|
|
||||||
const map = L.map("map" + i, { center, zoom, zoomControl: false });
|
const map = L.map("map" + i, { center: urlPosition.center, zoom: urlPosition.zoom, zoomControl: false });
|
||||||
map.on("move", () => sync(map));
|
map.on("move", () => sync(map));
|
||||||
map.on("zoom", () => sync(map));
|
map.on("zoom", () => sync(map));
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue