mirror of
https://github.com/gpxstudio/gpx.studio.git
synced 2026-07-28 14:18:39 +00:00
Compare commits
32 Commits
dev
..
ef9a5247f0
| Author | SHA1 | Date | |
|---|---|---|---|
| ef9a5247f0 | |||
| 2418f9bf4d | |||
| 5263b88fb7 | |||
| b5eb617fbc | |||
| f15ee2c6cf | |||
| 30369cc952 | |||
| 8a089708dc | |||
| e3da56e455 | |||
| bab4910ee0 | |||
| 8301d610cb | |||
| 6887b7de7e | |||
| ab4667546a | |||
| 08233c9e25 | |||
| be7bdc14b6 | |||
| 11d488e999 | |||
| 5f023281b0 | |||
| a224ac3dcd | |||
| 598b2a30fe | |||
| eb5a71a6f1 | |||
| e1198d0dc9 | |||
| 08828d609d | |||
| 281d5f87c1 | |||
| 282cfe4dbd | |||
| 59536ee63a | |||
| 2dda05f22c | |||
| 1354ca1d2a | |||
| 94e69c9774 | |||
| 5a85bc41ea | |||
| bd9e7ea726 | |||
| aa861be53d | |||
| 52387a40e6 | |||
| dd4c5e17ff |
Generated
+67
-70
@@ -20,7 +20,7 @@
|
||||
"immer": "^10.1.1",
|
||||
"jszip": "^3.10.1",
|
||||
"mapillary-js": "^4.1.2",
|
||||
"maplibre-gl": "^6.0.0",
|
||||
"maplibre-gl": "^5.21.1",
|
||||
"sanitize-html": "^2.17.0",
|
||||
"sortablejs": "^1.15.6"
|
||||
},
|
||||
@@ -3236,18 +3236,13 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@mapbox/jsonlint-lines-primitives": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.3.tgz",
|
||||
"integrity": "sha512-0SElaV0uMxEnxzBhhX9WTuPyUeMsAN/SS0i16tjuba4/mio63MG9khjC1a0JAiPGXAwvwm4UfHJURCN7nyudQg==",
|
||||
"license": "MIT",
|
||||
"version": "2.0.2",
|
||||
"engines": {
|
||||
"node": ">= 22"
|
||||
"node": ">= 0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/@mapbox/point-geometry": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/point-geometry/-/point-geometry-1.1.0.tgz",
|
||||
"integrity": "sha512-YGcBz1cg4ATXDCM/71L9xveh4dynfGmcLDqufR+nQQy3fKwsAZsWd/x4621/6uJaeB9mwOHE6hPeDgXz9uViUQ==",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/@mapbox/sphericalmercator": {
|
||||
@@ -3258,32 +3253,24 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@mapbox/tiny-sdf": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/tiny-sdf/-/tiny-sdf-2.2.0.tgz",
|
||||
"integrity": "sha512-LVL4wgI9YAum5V+LNVQO6QgFBPw7/MIIY4XJPNsPDMrjEwcE+JfKk1LuIl8GnF197ejVdC9QdPaxrx5gfgdGXg==",
|
||||
"version": "2.0.7",
|
||||
"license": "BSD-2-Clause"
|
||||
},
|
||||
"node_modules/@mapbox/unitbezier": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/unitbezier/-/unitbezier-1.0.0.tgz",
|
||||
"integrity": "sha512-fqd515fjBmANKGGsQ286E2Wvj/XvDFpGzwJxq4CI6jMQue6Oy04uCKp+JWKF00xRTmk6cEu1jPJ9p3xqH8YWqQ==",
|
||||
"version": "0.0.1",
|
||||
"license": "BSD-2-Clause"
|
||||
},
|
||||
"node_modules/@mapbox/vector-tile": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@mapbox/vector-tile/-/vector-tile-3.0.0.tgz",
|
||||
"integrity": "sha512-Qf10S1uIHMk20ri/IVBnpS+esUEkVaR5Hftmz88jTInrpmWgPGJfPe3LVjjlE77trLx8tH6qjTG7uWH9hIq/0Q==",
|
||||
"version": "2.0.4",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"@mapbox/point-geometry": "~1.1.0",
|
||||
"@types/geojson": "^7946.0.16",
|
||||
"pbf": "^5.0.0"
|
||||
"pbf": "^4.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@mapbox/vector-tile/node_modules/pbf": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/pbf/-/pbf-5.1.2.tgz",
|
||||
"integrity": "sha512-mnvGdvOrIvJOBGUEdGkrVXjN8E/VkIJCkf2eS1DH2yv82ORUlLttmDt0rWY38yYZmVwciZwBUvHM20qxBZf40w==",
|
||||
"version": "4.0.1",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"resolve-protobuf-schema": "^2.1.0"
|
||||
@@ -3292,13 +3279,18 @@
|
||||
"pbf": "bin/pbf"
|
||||
}
|
||||
},
|
||||
"node_modules/@mapbox/whoots-js": {
|
||||
"version": "3.1.0",
|
||||
"license": "ISC",
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@maplibre/geojson-vt": {
|
||||
"version": "6.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@maplibre/geojson-vt/-/geojson-vt-6.1.1.tgz",
|
||||
"integrity": "sha512-FVMOcmSP/yqol45t7StApEyTL5/vmqBCuFhH9n+fFuINenhaX+YgHHIt1yJ86S8kln3uJLcMvmEU2cfn6E2eCQ==",
|
||||
"version": "6.0.4",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"kdbush": "^4.1.0"
|
||||
"kdbush": "^4.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/@maplibre/maplibre-gl-geocoder": {
|
||||
@@ -3319,16 +3311,15 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@maplibre/maplibre-gl-style-spec": {
|
||||
"version": "26.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@maplibre/maplibre-gl-style-spec/-/maplibre-gl-style-spec-26.2.1.tgz",
|
||||
"integrity": "sha512-QFKCXkOeSzOr8jF75jm6kySOg+dUvOehPhRi68gcOYPHb7U5JloUq0dJW0Y5/fZV8ygfT0Vp2RWodvq+fyxFWA==",
|
||||
"version": "24.8.1",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@mapbox/jsonlint-lines-primitives": "^2.0.3",
|
||||
"@mapbox/unitbezier": "^1.0.0",
|
||||
"@mapbox/jsonlint-lines-primitives": "~2.0.2",
|
||||
"@mapbox/unitbezier": "^0.0.1",
|
||||
"json-stringify-pretty-compact": "^4.0.0",
|
||||
"minimist": "^1.2.8",
|
||||
"quickselect": "^3.0.0",
|
||||
"rw": "^1.3.3",
|
||||
"tinyqueue": "^3.0.0"
|
||||
},
|
||||
"bin": {
|
||||
@@ -3338,29 +3329,31 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@maplibre/mlt": {
|
||||
"version": "1.1.12",
|
||||
"resolved": "https://registry.npmjs.org/@maplibre/mlt/-/mlt-1.1.12.tgz",
|
||||
"integrity": "sha512-ZeK5w2TTeHOajcLaEQs1KZXw2V9wIKo1PmThlxlsHoXsQsYlBqLJzPOd6tJHRtGTChUY3DPPmjXRArYVvAbmZw==",
|
||||
"version": "1.1.8",
|
||||
"license": "(MIT OR Apache-2.0)",
|
||||
"dependencies": {
|
||||
"@mapbox/point-geometry": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@maplibre/vt-pbf": {
|
||||
"version": "4.3.2",
|
||||
"resolved": "https://registry.npmjs.org/@maplibre/vt-pbf/-/vt-pbf-4.3.2.tgz",
|
||||
"integrity": "sha512-j6p0AdjvAR19Z3XaCysle7A4ZSo08tYOzxD0Y9NQylwPAkwJJeYub5b2eVucdeDh7erhv69DahoLOevDRERRUw==",
|
||||
"version": "4.3.0",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@mapbox/point-geometry": "^1.1.0",
|
||||
"@mapbox/vector-tile": "^2.0.4",
|
||||
"@maplibre/geojson-vt": "^5.0.4",
|
||||
"@types/geojson": "^7946.0.16",
|
||||
"pbf": "^5.1.0"
|
||||
"@types/supercluster": "^7.1.3",
|
||||
"pbf": "^4.0.1",
|
||||
"supercluster": "^8.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@maplibre/vt-pbf/node_modules/@maplibre/geojson-vt": {
|
||||
"version": "5.0.4",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/@maplibre/vt-pbf/node_modules/pbf": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/pbf/-/pbf-5.1.2.tgz",
|
||||
"integrity": "sha512-mnvGdvOrIvJOBGUEdGkrVXjN8E/VkIJCkf2eS1DH2yv82ORUlLttmDt0rWY38yYZmVwciZwBUvHM20qxBZf40w==",
|
||||
"version": "4.0.1",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"resolve-protobuf-schema": "^2.1.0"
|
||||
@@ -4296,6 +4289,13 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/supercluster": {
|
||||
"version": "7.1.3",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/geojson": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/three": {
|
||||
"version": "0.134.0",
|
||||
"license": "MIT"
|
||||
@@ -5720,8 +5720,6 @@
|
||||
},
|
||||
"node_modules/json-stringify-pretty-compact": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/json-stringify-pretty-compact/-/json-stringify-pretty-compact-4.0.0.tgz",
|
||||
"integrity": "sha512-3CNZ2DnrpByG9Nqj6Xo8vqbjT4F6N+tb4Gb28ESAZjYZ5yqvmc56J+/kuIwkaAMOyblTQhUW7PxMkUb8Q36N3Q==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/jszip": {
|
||||
@@ -5735,9 +5733,7 @@
|
||||
}
|
||||
},
|
||||
"node_modules/kdbush": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/kdbush/-/kdbush-4.1.0.tgz",
|
||||
"integrity": "sha512-e9vurzrXJQrFX6ckpHP3bvj5l+9CnYzkxDNnNQ1h2QTqdWsUAJgXiKdGNcOa1EY85dU8KbQ+z/FdQdB7P+9yfQ==",
|
||||
"version": "4.0.2",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/keyv": {
|
||||
@@ -6158,25 +6154,25 @@
|
||||
"license": "(MIT AND Zlib)"
|
||||
},
|
||||
"node_modules/maplibre-gl": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-6.0.0.tgz",
|
||||
"integrity": "sha512-1wBgEhzTZfA+cDpFdt0fM1mJA5mJ90fifORJ7D8JcKLJCvPT/iTx9bNxkP7DqEYde65DJd7gE7h83khwNRqdyg==",
|
||||
"version": "5.22.0",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"@mapbox/jsonlint-lines-primitives": "^2.0.2",
|
||||
"@mapbox/point-geometry": "^1.1.0",
|
||||
"@mapbox/tiny-sdf": "^2.2.0",
|
||||
"@mapbox/unitbezier": "^1.0.0",
|
||||
"@mapbox/vector-tile": "^3.0.0",
|
||||
"@maplibre/geojson-vt": "^6.1.1",
|
||||
"@maplibre/maplibre-gl-style-spec": "^26.1.0",
|
||||
"@maplibre/mlt": "^1.1.12",
|
||||
"@maplibre/vt-pbf": "^4.3.2",
|
||||
"@mapbox/tiny-sdf": "^2.0.7",
|
||||
"@mapbox/unitbezier": "^0.0.1",
|
||||
"@mapbox/vector-tile": "^2.0.4",
|
||||
"@mapbox/whoots-js": "^3.1.0",
|
||||
"@maplibre/geojson-vt": "^6.0.4",
|
||||
"@maplibre/maplibre-gl-style-spec": "^24.8.1",
|
||||
"@maplibre/mlt": "^1.1.8",
|
||||
"@maplibre/vt-pbf": "^4.3.0",
|
||||
"@types/geojson": "^7946.0.16",
|
||||
"earcut": "^3.2.3",
|
||||
"earcut": "^3.0.2",
|
||||
"gl-matrix": "^3.4.4",
|
||||
"kdbush": "^4.1.0",
|
||||
"kdbush": "^4.0.2",
|
||||
"murmurhash-js": "^1.0.0",
|
||||
"pbf": "^5.1.2",
|
||||
"pbf": "^4.0.1",
|
||||
"potpack": "^2.1.0",
|
||||
"quickselect": "^3.0.0",
|
||||
"tinyqueue": "^3.0.0"
|
||||
@@ -6190,15 +6186,11 @@
|
||||
}
|
||||
},
|
||||
"node_modules/maplibre-gl/node_modules/earcut": {
|
||||
"version": "3.2.3",
|
||||
"resolved": "https://registry.npmjs.org/earcut/-/earcut-3.2.3.tgz",
|
||||
"integrity": "sha512-vnS4AVwp1KHAF13i1vp1/2D5evWy3k5u/iW/B81QVsUZtV8cv2tU0b2VNFlqvh4kYwrFMDdjPCfAmfyJW9y14Q==",
|
||||
"version": "3.0.2",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/maplibre-gl/node_modules/pbf": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/pbf/-/pbf-5.1.2.tgz",
|
||||
"integrity": "sha512-mnvGdvOrIvJOBGUEdGkrVXjN8E/VkIJCkf2eS1DH2yv82ORUlLttmDt0rWY38yYZmVwciZwBUvHM20qxBZf40w==",
|
||||
"version": "4.0.1",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"resolve-protobuf-schema": "^2.1.0"
|
||||
@@ -6259,8 +6251,6 @@
|
||||
},
|
||||
"node_modules/minimist": {
|
||||
"version": "1.2.8",
|
||||
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
|
||||
"integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==",
|
||||
"license": "MIT",
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
@@ -6795,8 +6785,6 @@
|
||||
},
|
||||
"node_modules/quickselect": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/quickselect/-/quickselect-3.0.0.tgz",
|
||||
"integrity": "sha512-XdjUArbK4Bm5fLLvlm5KpTFOiOThgfWWI4axAZDWg4E/0mKdZyI9tNEfds27qCi1ze/vwTR16kvmmGhRra3c2g==",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/rbush": {
|
||||
@@ -6932,6 +6920,10 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/rw": {
|
||||
"version": "1.3.3",
|
||||
"license": "BSD-3-Clause"
|
||||
},
|
||||
"node_modules/rxjs": {
|
||||
"version": "7.8.2",
|
||||
"license": "Apache-2.0",
|
||||
@@ -7165,6 +7157,13 @@
|
||||
"xtend": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/supercluster": {
|
||||
"version": "8.0.1",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"kdbush": "^4.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||
@@ -7406,8 +7405,6 @@
|
||||
},
|
||||
"node_modules/tinyqueue": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/tinyqueue/-/tinyqueue-3.0.0.tgz",
|
||||
"integrity": "sha512-gRa9gwYU3ECmQYv3lslts5hxuIa90veaEcxDYuu3QGOIAEM2mOZkVHp48ANJuu1CURtRdHKUBY5Lm1tHV+sD4g==",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/totalist": {
|
||||
|
||||
@@ -75,7 +75,7 @@
|
||||
"immer": "^10.1.1",
|
||||
"jszip": "^3.10.1",
|
||||
"mapillary-js": "^4.1.2",
|
||||
"maplibre-gl": "^6.0.0",
|
||||
"maplibre-gl": "^5.21.1",
|
||||
"sanitize-html": "^2.17.0",
|
||||
"sortablejs": "^1.15.6"
|
||||
}
|
||||
|
||||
@@ -1168,7 +1168,7 @@ export type CustomLayer = {
|
||||
maxZoom: number;
|
||||
layerType: 'basemap' | 'overlay';
|
||||
resourceType: 'raster' | 'vector';
|
||||
value: string | StyleSpecification;
|
||||
value: string | maplibregl.StyleSpecification;
|
||||
};
|
||||
|
||||
type OverpassQueryData = {
|
||||
|
||||
@@ -21,7 +21,6 @@
|
||||
import { selection } from '$lib/logic/selection';
|
||||
import { untrack } from 'svelte';
|
||||
import { isSelected, toggle } from '$lib/components/map/layer-control/utils';
|
||||
import { boundsManager } from '$lib/logic/bounds';
|
||||
|
||||
let {
|
||||
useHash = true,
|
||||
@@ -91,7 +90,6 @@
|
||||
fileStateCollection.setEmbeddedFiles(files);
|
||||
$fileOrder = ids;
|
||||
selection.selectAll();
|
||||
boundsManager.fitBoundsOnLoad(ids);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
import CustomControl from './custom-control';
|
||||
import { map } from '$lib/components/map/map';
|
||||
import { onMount, type Snippet } from 'svelte';
|
||||
import type { Map } from 'maplibre-gl';
|
||||
|
||||
let {
|
||||
position = 'top-right',
|
||||
@@ -18,7 +17,7 @@
|
||||
let control: CustomControl | null = null;
|
||||
|
||||
onMount(() => {
|
||||
map.onLoad((map: Map) => {
|
||||
map.onLoad((map: maplibregl.Map) => {
|
||||
if (position.includes('right')) container.classList.add('float-right');
|
||||
else container.classList.add('float-left');
|
||||
container.classList.remove('hidden');
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
import { MapPopup } from '$lib/components/map/map-popup';
|
||||
import type { Map } from 'maplibre-gl';
|
||||
|
||||
export let waypointPopup: MapPopup | null = null;
|
||||
export let trackpointPopup: MapPopup | null = null;
|
||||
|
||||
export function createPopups(map: Map) {
|
||||
export function createPopups(map: maplibregl.Map) {
|
||||
removePopups();
|
||||
waypointPopup = new MapPopup(map, {
|
||||
closeButton: false,
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
import { get, type Readable } from 'svelte/store';
|
||||
import {
|
||||
import maplibregl, {
|
||||
type GeoJSONSource,
|
||||
type FilterSpecification,
|
||||
type MapLayerMouseEvent,
|
||||
type MapLayerTouchEvent,
|
||||
Point,
|
||||
} from 'maplibre-gl';
|
||||
import { map } from '$lib/components/map/map';
|
||||
import { waypointPopup, trackpointPopup } from './gpx-layer-popup';
|
||||
@@ -121,7 +120,7 @@ export class GPXLayer {
|
||||
selected: boolean = false;
|
||||
currentWaypointData: GeoJSON.FeatureCollection | null = null;
|
||||
draggedWaypointIndex: number | null = null;
|
||||
draggingStartingPosition: Point = new Point(0, 0);
|
||||
draggingStartingPosition: maplibregl.Point = new maplibregl.Point(0, 0);
|
||||
unsubscribe: Function[] = [];
|
||||
|
||||
updateBinded: () => void = this.update.bind(this);
|
||||
|
||||
@@ -7,7 +7,6 @@
|
||||
import { Layers } from '@lucide/svelte';
|
||||
import { settings } from '$lib/logic/settings';
|
||||
import { map } from '$lib/components/map/map';
|
||||
import type { Map } from 'maplibre-gl';
|
||||
|
||||
let container: HTMLDivElement;
|
||||
let overpassLayer: OverpassLayer;
|
||||
@@ -22,7 +21,7 @@
|
||||
selectedOverpassTree,
|
||||
} = settings;
|
||||
|
||||
map.onLoad((_map: Map) => {
|
||||
map.onLoad((_map: maplibregl.Map) => {
|
||||
if (overpassLayer) {
|
||||
overpassLayer.remove();
|
||||
}
|
||||
|
||||
@@ -15,9 +15,7 @@
|
||||
poi: PopupItem<any>;
|
||||
} = $props();
|
||||
|
||||
let tags: Record<string, string> = $derived(
|
||||
poi ? (typeof poi.item.tags == 'object' ? poi.item.tags : JSON.parse(poi.item.tags)) : {}
|
||||
);
|
||||
let tags: Record<string, string> = $derived(poi ? JSON.parse(poi.item.tags) : {});
|
||||
let name = $derived.by(() => {
|
||||
if (poi) {
|
||||
if (tags.name !== undefined && tags.name !== '') {
|
||||
|
||||
@@ -6,7 +6,7 @@ import { overpassQueryData } from '$lib/assets/layers';
|
||||
import { MapPopup } from '$lib/components/map/map-popup';
|
||||
import { settings } from '$lib/logic/settings';
|
||||
import { db } from '$lib/db';
|
||||
import type { Map as MapLibreMap, GeoJSONSource } from 'maplibre-gl';
|
||||
import type { GeoJSONSource } from 'maplibre-gl';
|
||||
import { ANCHOR_LAYER_KEY } from '$lib/components/map/style';
|
||||
import type { MapLayerEventManager } from '$lib/components/map/map-layer-event-manager';
|
||||
import { loadSVGIcon } from '$lib/utils';
|
||||
@@ -28,7 +28,7 @@ export class OverpassLayer {
|
||||
minZoom = 12;
|
||||
queryZoom = 12;
|
||||
expirationTime = 7 * 24 * 3600 * 1000;
|
||||
map: MapLibreMap;
|
||||
map: maplibregl.Map;
|
||||
layerEventManager: MapLayerEventManager;
|
||||
popup: MapPopup;
|
||||
|
||||
@@ -40,7 +40,7 @@ export class OverpassLayer {
|
||||
updateBinded = this.update.bind(this);
|
||||
onHoverBinded = this.onHover.bind(this);
|
||||
|
||||
constructor(map: MapLibreMap, layerEventManager: MapLayerEventManager) {
|
||||
constructor(map: maplibregl.Map, layerEventManager: MapLayerEventManager) {
|
||||
this.map = map;
|
||||
this.layerEventManager = layerEventManager;
|
||||
this.popup = new MapPopup(map, {
|
||||
|
||||
@@ -1,19 +1,10 @@
|
||||
import { fileStateCollection } from '$lib/logic/file-state';
|
||||
import {
|
||||
LngLatBounds,
|
||||
MapMouseEvent,
|
||||
MapTouchEvent,
|
||||
Point,
|
||||
type Map,
|
||||
type MapGeoJSONFeature,
|
||||
type MapLayerMouseEvent,
|
||||
type MapLayerTouchEvent,
|
||||
} from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
|
||||
type MapLayerMouseEventListener = (e: MapLayerMouseEvent) => void;
|
||||
type MapLayerTouchEventListener = (e: MapLayerTouchEvent) => void;
|
||||
type MapLayerMouseEventListener = (e: maplibregl.MapLayerMouseEvent) => void;
|
||||
type MapLayerTouchEventListener = (e: maplibregl.MapLayerTouchEvent) => void;
|
||||
type MapLayerListener = {
|
||||
features: MapGeoJSONFeature[];
|
||||
features: maplibregl.MapGeoJSONFeature[];
|
||||
mousemoves: MapLayerMouseEventListener[];
|
||||
mouseenters: MapLayerMouseEventListener[];
|
||||
mouseleaves: MapLayerMouseEventListener[];
|
||||
@@ -24,10 +15,10 @@ type MapLayerListener = {
|
||||
};
|
||||
|
||||
export class MapLayerEventManager {
|
||||
private _map: Map;
|
||||
private _map: maplibregl.Map;
|
||||
private _listeners: Record<string, MapLayerListener> = {};
|
||||
|
||||
constructor(map: Map) {
|
||||
constructor(map: maplibregl.Map) {
|
||||
this._map = map;
|
||||
this._map.on('mousemove', this._handleMouseMove.bind(this));
|
||||
this._map.on('click', this._handleMouseClick.bind(this, 'click'));
|
||||
@@ -150,7 +141,7 @@ export class MapLayerEventManager {
|
||||
}
|
||||
}
|
||||
|
||||
private _handleMouseMove(e: MapMouseEvent) {
|
||||
private _handleMouseMove(e: maplibregl.MapMouseEvent) {
|
||||
if (e.originalEvent.buttons > 0) return;
|
||||
const featuresByLayer = this._getRenderedFeaturesByLayer(e);
|
||||
Object.keys(this._listeners).forEach((layerId) => {
|
||||
@@ -159,20 +150,29 @@ export class MapLayerEventManager {
|
||||
if ((features.length == 0) != (listener.features.length == 0)) {
|
||||
if (features.length > 0) {
|
||||
if (listener.mouseenters.length > 0) {
|
||||
const event = new MapMouseEvent('mouseenter', e.target, e.originalEvent, {
|
||||
features: featuresByLayer[layerId]!,
|
||||
});
|
||||
const event = new maplibregl.MapMouseEvent(
|
||||
'mouseenter',
|
||||
e.target,
|
||||
e.originalEvent,
|
||||
{
|
||||
features: featuresByLayer[layerId]!,
|
||||
}
|
||||
);
|
||||
listener.mouseenters.forEach((l) => l(event));
|
||||
}
|
||||
} else {
|
||||
if (listener.mouseleaves.length > 0) {
|
||||
const event = new MapMouseEvent('mouseleave', e.target, e.originalEvent);
|
||||
const event = new maplibregl.MapMouseEvent(
|
||||
'mouseleave',
|
||||
e.target,
|
||||
e.originalEvent
|
||||
);
|
||||
listener.mouseleaves.forEach((l) => l(event));
|
||||
}
|
||||
}
|
||||
}
|
||||
if (features.length > 0 && listener.mousemoves.length > 0) {
|
||||
const event = new MapMouseEvent('mousemove', e.target, e.originalEvent, {
|
||||
const event = new maplibregl.MapMouseEvent('mousemove', e.target, e.originalEvent, {
|
||||
features: featuresByLayer[layerId]!,
|
||||
});
|
||||
listener.mousemoves.forEach((l) => l(event));
|
||||
@@ -181,39 +181,49 @@ export class MapLayerEventManager {
|
||||
});
|
||||
}
|
||||
|
||||
private _handleMouseClick(type: string, e: MapMouseEvent) {
|
||||
private _handleMouseClick(type: string, e: maplibregl.MapMouseEvent) {
|
||||
const featuresByLayer = this._getRenderedFeaturesByLayer(e);
|
||||
Object.keys(this._listeners).forEach((layerId) => {
|
||||
const features = featuresByLayer[layerId] || [];
|
||||
const listener = this._listeners[layerId];
|
||||
if (features.length > 0) {
|
||||
if (type === 'click' && listener.clicks.length > 0) {
|
||||
const event = new MapMouseEvent('click', e.target, e.originalEvent, {
|
||||
const event = new maplibregl.MapMouseEvent('click', e.target, e.originalEvent, {
|
||||
features: features,
|
||||
});
|
||||
listener.clicks.forEach((l) => l(event));
|
||||
} else if (type === 'contextmenu' && listener.contextmenus.length > 0) {
|
||||
const event = new MapMouseEvent('contextmenu', e.target, e.originalEvent, {
|
||||
features: features,
|
||||
});
|
||||
const event = new maplibregl.MapMouseEvent(
|
||||
'contextmenu',
|
||||
e.target,
|
||||
e.originalEvent,
|
||||
{
|
||||
features: features,
|
||||
}
|
||||
);
|
||||
listener.contextmenus.forEach((l) => l(event));
|
||||
} else if (type === 'mousedown' && listener.mousedowns.length > 0) {
|
||||
const event = new MapMouseEvent('mousedown', e.target, e.originalEvent, {
|
||||
features: features,
|
||||
});
|
||||
const event = new maplibregl.MapMouseEvent(
|
||||
'mousedown',
|
||||
e.target,
|
||||
e.originalEvent,
|
||||
{
|
||||
features: features,
|
||||
}
|
||||
);
|
||||
listener.mousedowns.forEach((l) => l(event));
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private _handleTouchStart(e: MapTouchEvent) {
|
||||
private _handleTouchStart(e: maplibregl.MapTouchEvent) {
|
||||
const featuresByLayer = this._getRenderedFeaturesByLayer(e);
|
||||
Object.keys(this._listeners).forEach((layerId) => {
|
||||
const features = featuresByLayer[layerId] || [];
|
||||
const listener = this._listeners[layerId];
|
||||
if (features.length > 0) {
|
||||
const event: MapLayerTouchEvent = new MapTouchEvent(
|
||||
const event: maplibregl.MapLayerTouchEvent = new maplibregl.MapTouchEvent(
|
||||
'touchstart',
|
||||
e.target,
|
||||
e.originalEvent
|
||||
@@ -224,15 +234,18 @@ export class MapLayerEventManager {
|
||||
});
|
||||
}
|
||||
|
||||
private _getBounds(point: Point) {
|
||||
private _getBounds(point: maplibregl.Point) {
|
||||
const delta = 30;
|
||||
return new LngLatBounds(
|
||||
return new maplibregl.LngLatBounds(
|
||||
this._map.unproject([point.x - delta, point.y + delta]),
|
||||
this._map.unproject([point.x + delta, point.y - delta])
|
||||
);
|
||||
}
|
||||
|
||||
private _filterLayersIntersectingBounds(layerIds: string[], bounds: LngLatBounds): string[] {
|
||||
private _filterLayersIntersectingBounds(
|
||||
layerIds: string[],
|
||||
bounds: maplibregl.LngLatBounds
|
||||
): string[] {
|
||||
let result = layerIds.filter((layerId) => {
|
||||
if (!this._map.getLayer(layerId)) return false;
|
||||
const fileId = layerId.replace('-waypoints', '');
|
||||
@@ -248,7 +261,7 @@ export class MapLayerEventManager {
|
||||
return result;
|
||||
}
|
||||
|
||||
private _getRenderedFeaturesByLayer(e: MapMouseEvent | MapTouchEvent) {
|
||||
private _getRenderedFeaturesByLayer(e: maplibregl.MapMouseEvent | maplibregl.MapTouchEvent) {
|
||||
const layerIds = this._filterLayersIntersectingBounds(
|
||||
Object.keys(this._listeners),
|
||||
this._getBounds(e.point)
|
||||
@@ -257,7 +270,7 @@ export class MapLayerEventManager {
|
||||
layerIds.length > 0
|
||||
? this._map.queryRenderedFeatures(e.point, { layers: layerIds })
|
||||
: [];
|
||||
const featuresByLayer: Record<string, MapGeoJSONFeature[]> = {};
|
||||
const featuresByLayer: Record<string, maplibregl.MapGeoJSONFeature[]> = {};
|
||||
features.forEach((f) => {
|
||||
if (!featuresByLayer[f.layer.id]) {
|
||||
featuresByLayer[f.layer.id] = [];
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { TrackPoint, Waypoint } from 'gpx';
|
||||
import { LngLat, Map, MapMouseEvent, Popup, type PopupOptions } from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import { mount, tick, unmount } from 'svelte';
|
||||
import { get, writable, type Writable } from 'svelte/store';
|
||||
import MapPopupComponent from '$lib/components/map/MapPopup.svelte';
|
||||
@@ -11,15 +11,15 @@ export type PopupItem<T = Waypoint | TrackPoint | any> = {
|
||||
};
|
||||
|
||||
export class MapPopup {
|
||||
map: Map;
|
||||
popup: Popup;
|
||||
map: maplibregl.Map;
|
||||
popup: maplibregl.Popup;
|
||||
item: Writable<PopupItem | null> = writable(null);
|
||||
component: ReturnType<typeof mount>;
|
||||
maybeHideBinded = this.maybeHide.bind(this);
|
||||
|
||||
constructor(map: Map, options?: PopupOptions) {
|
||||
constructor(map: maplibregl.Map, options?: maplibregl.PopupOptions) {
|
||||
this.map = map;
|
||||
this.popup = new Popup(options);
|
||||
this.popup = new maplibregl.Popup(options);
|
||||
this.component = mount(MapPopupComponent, {
|
||||
target: document.body,
|
||||
props: {
|
||||
@@ -51,7 +51,7 @@ export class MapPopup {
|
||||
this.map.on('mousemove', this.maybeHideBinded);
|
||||
}
|
||||
|
||||
maybeHide(e: MapMouseEvent) {
|
||||
maybeHide(e: maplibregl.MapMouseEvent) {
|
||||
const item = get(this.item);
|
||||
if (item === null) {
|
||||
this.hide();
|
||||
@@ -75,10 +75,10 @@ export class MapPopup {
|
||||
getCoordinates() {
|
||||
const item = get(this.item);
|
||||
if (item === null) {
|
||||
return new LngLat(0, 0);
|
||||
return new maplibregl.LngLat(0, 0);
|
||||
}
|
||||
return item.item instanceof Waypoint || item.item instanceof TrackPoint
|
||||
? item.item.getCoordinates()
|
||||
: new LngLat(item.item.lon, item.item.lat);
|
||||
: new maplibregl.LngLat(item.item.lon, item.item.lat);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import * as maplibregl from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import 'maplibre-gl/dist/maplibre-gl.css';
|
||||
import workerUrl from 'maplibre-gl/dist/maplibre-gl-worker.mjs?worker&url';
|
||||
import MaplibreGeocoder, {
|
||||
type MaplibreGeocoderFeatureResults,
|
||||
} from '@maplibre/maplibre-gl-geocoder';
|
||||
@@ -40,7 +39,6 @@ export class MapLibreGLMap {
|
||||
geocoder: boolean,
|
||||
geolocate: boolean
|
||||
) {
|
||||
maplibregl.setWorkerUrl(workerUrl);
|
||||
this._maptilerKey = maptilerKey;
|
||||
this._styleManager = new StyleManager(this._mapStore, this._maptilerKey);
|
||||
const map = new maplibregl.Map({
|
||||
|
||||
@@ -9,7 +9,6 @@
|
||||
import { i18n } from '$lib/i18n.svelte';
|
||||
import { onMount } from 'svelte';
|
||||
import ButtonWithTooltip from '$lib/components/ButtonWithTooltip.svelte';
|
||||
import type { Map } from 'maplibre-gl';
|
||||
|
||||
const { streetViewSource } = settings;
|
||||
|
||||
@@ -21,7 +20,7 @@
|
||||
let container: HTMLElement;
|
||||
|
||||
onMount(() => {
|
||||
map.onLoad((map_: Map) => {
|
||||
map.onLoad((map_: maplibregl.Map) => {
|
||||
googleRedirect = new GoogleRedirect(map_);
|
||||
mapillaryLayer = new MapillaryLayer(
|
||||
map_,
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
import { mapCursor, MapCursorState } from '$lib/logic/map-cursor';
|
||||
import type { Map, MapMouseEvent } from 'maplibre-gl';
|
||||
|
||||
export class GoogleRedirect {
|
||||
map: Map;
|
||||
map: maplibregl.Map;
|
||||
enabled = false;
|
||||
|
||||
constructor(map: Map) {
|
||||
constructor(map: maplibregl.Map) {
|
||||
this.map = map;
|
||||
}
|
||||
|
||||
@@ -25,7 +24,7 @@ export class GoogleRedirect {
|
||||
this.map.off('click', this.openStreetView);
|
||||
}
|
||||
|
||||
openStreetView(e: MapMouseEvent) {
|
||||
openStreetView(e: maplibregl.MapMouseEvent) {
|
||||
window.open(
|
||||
`https://www.google.com/maps/@?api=1&map_action=pano&viewpoint=${e.lngLat.lat},${e.lngLat.lng}`
|
||||
);
|
||||
|
||||
@@ -1,10 +1,4 @@
|
||||
import {
|
||||
Map,
|
||||
Marker,
|
||||
type LayerSpecification,
|
||||
type MapLayerMouseEvent,
|
||||
type VectorSourceSpecification,
|
||||
} from 'maplibre-gl';
|
||||
import maplibregl, { type LayerSpecification, type VectorSourceSpecification } from 'maplibre-gl';
|
||||
import { Viewer, type ViewerBearingEvent } from 'mapillary-js/dist/mapillary.module';
|
||||
import 'mapillary-js/dist/mapillary.css';
|
||||
import { mapCursor, MapCursorState } from '$lib/logic/map-cursor';
|
||||
@@ -49,9 +43,9 @@ const mapillaryImageLayer: LayerSpecification = {
|
||||
};
|
||||
|
||||
export class MapillaryLayer {
|
||||
map: Map;
|
||||
map: maplibregl.Map;
|
||||
layerEventManager: MapLayerEventManager;
|
||||
marker: Marker;
|
||||
marker: maplibregl.Marker;
|
||||
viewer: Viewer;
|
||||
|
||||
active = false;
|
||||
@@ -62,7 +56,7 @@ export class MapillaryLayer {
|
||||
onMouseLeaveBinded = this.onMouseLeave.bind(this);
|
||||
|
||||
constructor(
|
||||
map: Map,
|
||||
map: maplibregl.Map,
|
||||
layerEventManager: MapLayerEventManager,
|
||||
container: HTMLElement,
|
||||
popupOpen: { value: boolean }
|
||||
@@ -81,7 +75,7 @@ export class MapillaryLayer {
|
||||
dot.className = 'maplibregl-user-location-dot';
|
||||
element.appendChild(dot);
|
||||
|
||||
this.marker = new Marker({
|
||||
this.marker = new maplibregl.Marker({
|
||||
rotationAlignment: 'map',
|
||||
element,
|
||||
});
|
||||
@@ -146,7 +140,7 @@ export class MapillaryLayer {
|
||||
this.popupOpen.value = false;
|
||||
}
|
||||
|
||||
onMouseEnter(e: MapLayerMouseEvent) {
|
||||
onMouseEnter(e: maplibregl.MapLayerMouseEvent) {
|
||||
if (
|
||||
e.features &&
|
||||
e.features.length > 0 &&
|
||||
|
||||
@@ -9,17 +9,11 @@ import {
|
||||
} from '$lib/assets/layers';
|
||||
import { getLayers } from '$lib/components/map/layer-control/utils';
|
||||
import { i18n } from '$lib/i18n.svelte';
|
||||
import type {
|
||||
Map,
|
||||
GeoJSONSourceSpecification,
|
||||
LayerSpecification,
|
||||
StyleSpecification,
|
||||
} from 'maplibre-gl';
|
||||
|
||||
const { currentBasemap, currentOverlays, customLayers, opacities, terrainSource, distanceUnits } =
|
||||
settings;
|
||||
|
||||
const emptySource: GeoJSONSourceSpecification = {
|
||||
const emptySource: maplibregl.GeoJSONSourceSpecification = {
|
||||
type: 'geojson',
|
||||
data: {
|
||||
type: 'FeatureCollection',
|
||||
@@ -38,18 +32,18 @@ export const ANCHOR_LAYER_KEY = {
|
||||
waypoints: 'waypoints-end',
|
||||
routingControls: 'routing-controls-end',
|
||||
};
|
||||
const anchorLayers: LayerSpecification[] = Object.values(ANCHOR_LAYER_KEY).map((id) => ({
|
||||
const anchorLayers: maplibregl.LayerSpecification[] = Object.values(ANCHOR_LAYER_KEY).map((id) => ({
|
||||
id: id,
|
||||
type: 'symbol',
|
||||
source: 'empty-source',
|
||||
}));
|
||||
|
||||
export class StyleManager {
|
||||
private _map: Writable<Map | null>;
|
||||
private _map: Writable<maplibregl.Map | null>;
|
||||
private _maptilerKey: string;
|
||||
private _pastOverlays: Set<string> = new Set();
|
||||
|
||||
constructor(map: Writable<Map | null>, maptilerKey: string) {
|
||||
constructor(map: Writable<maplibregl.Map | null>, maptilerKey: string) {
|
||||
this._map = map;
|
||||
this._maptilerKey = maptilerKey;
|
||||
this._map.subscribe((map_) => {
|
||||
@@ -64,7 +58,6 @@ export class StyleManager {
|
||||
opacities.subscribe(() => this.updateOverlays());
|
||||
terrainSource.subscribe(() => this.updateTerrain());
|
||||
customLayers.subscribe(() => this.updateBasemap());
|
||||
i18n.subscribe(() => this.updateBasemap());
|
||||
distanceUnits.subscribe(() => {
|
||||
const map = get(this._map);
|
||||
if (map && (map.getLayer('contours_m') || map.getLayer('contours_ft'))) {
|
||||
@@ -82,10 +75,10 @@ export class StyleManager {
|
||||
});
|
||||
}
|
||||
|
||||
async buildStyle(basemap: string): Promise<StyleSpecification> {
|
||||
async buildStyle(basemap: string): Promise<maplibregl.StyleSpecification> {
|
||||
const custom = get(customLayers);
|
||||
|
||||
const style: StyleSpecification = {
|
||||
const style: maplibregl.StyleSpecification = {
|
||||
version: 8,
|
||||
projection: {
|
||||
type: 'globe',
|
||||
@@ -98,7 +91,7 @@ export class StyleManager {
|
||||
|
||||
const basemapInfo = basemaps[basemap] ?? custom[basemap]?.value ?? basemaps[defaultBasemap];
|
||||
|
||||
let basemapStyle = basemaps.openStreetMap as StyleSpecification;
|
||||
let basemapStyle = basemaps.openStreetMap as maplibregl.StyleSpecification;
|
||||
try {
|
||||
basemapStyle = await this.get(basemapInfo);
|
||||
for (const source in basemapStyle.sources) {
|
||||
@@ -209,7 +202,9 @@ export class StyleManager {
|
||||
}
|
||||
}
|
||||
|
||||
async get(styleInfo: StyleSpecification | string): Promise<StyleSpecification> {
|
||||
async get(
|
||||
styleInfo: maplibregl.StyleSpecification | string
|
||||
): Promise<maplibregl.StyleSpecification> {
|
||||
if (typeof styleInfo === 'string') {
|
||||
let styleUrl = styleInfo as string;
|
||||
const response = await fetch(styleUrl, { cache: 'force-cache' });
|
||||
@@ -223,7 +218,7 @@ export class StyleManager {
|
||||
}
|
||||
}
|
||||
|
||||
merge(style: StyleSpecification, other: StyleSpecification) {
|
||||
merge(style: maplibregl.StyleSpecification, other: maplibregl.StyleSpecification) {
|
||||
style.sources = { ...style.sources, ...other.sources };
|
||||
const units = get(distanceUnits);
|
||||
for (let layer of other.layers ?? []) {
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
import Clean from '$lib/components/toolbar/tools/Clean.svelte';
|
||||
import Reduce from '$lib/components/toolbar/tools/reduce/Reduce.svelte';
|
||||
import RoutingControlPopup from '$lib/components/toolbar/tools/routing/RoutingControlPopup.svelte';
|
||||
import { Popup } from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import { settings } from '$lib/logic/settings';
|
||||
|
||||
let {
|
||||
@@ -23,11 +23,11 @@
|
||||
const { minimizeRoutingMenu } = settings;
|
||||
|
||||
let popupElement: HTMLDivElement | undefined = $state(undefined);
|
||||
let popup: Popup | undefined = $derived.by(() => {
|
||||
let popup: maplibregl.Popup | undefined = $derived.by(() => {
|
||||
if (!popupElement) {
|
||||
return undefined;
|
||||
}
|
||||
let popup = new Popup({
|
||||
let popup = new maplibregl.Popup({
|
||||
closeButton: false,
|
||||
maxWidth: undefined,
|
||||
});
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
import { getURLForLanguage } from '$lib/utils';
|
||||
import { Trash2 } from '@lucide/svelte';
|
||||
import { map } from '$lib/components/map/map';
|
||||
import type { GeoJSONSource, LngLat } from 'maplibre-gl';
|
||||
import type { GeoJSONSource } from 'maplibre-gl';
|
||||
import { selection } from '$lib/logic/selection';
|
||||
import { fileActions } from '$lib/logic/file-actions';
|
||||
import { mapCursor, MapCursorState } from '$lib/logic/map-cursor';
|
||||
@@ -29,7 +29,7 @@
|
||||
let cleanType = $state(CleanType.INSIDE);
|
||||
let deleteTrackpoints = $state(true);
|
||||
let deleteWaypoints = $state(true);
|
||||
let rectangleCoordinates: LngLat[] = $state([]);
|
||||
let rectangleCoordinates: maplibregl.LngLat[] = $state([]);
|
||||
|
||||
$effect(() => {
|
||||
if ($map) {
|
||||
|
||||
@@ -41,7 +41,6 @@
|
||||
import { fileActions, getFileIds, newGPXFile } from '$lib/logic/file-actions';
|
||||
import { mapCursor, MapCursorState } from '$lib/logic/map-cursor';
|
||||
import { RoutingControls, routingControls } from './routing-controls';
|
||||
import type { Popup } from 'maplibre-gl';
|
||||
|
||||
let {
|
||||
minimized = $bindable(false),
|
||||
@@ -52,7 +51,7 @@
|
||||
}: {
|
||||
minimized?: boolean;
|
||||
minimizable?: boolean;
|
||||
popup?: Popup;
|
||||
popup?: maplibregl.Popup;
|
||||
popupElement?: HTMLDivElement;
|
||||
class?: string;
|
||||
} = $props();
|
||||
|
||||
@@ -1,12 +1,10 @@
|
||||
import { distance, type Coordinates, TrackPoint, TrackSegment, Track, projectedPoint } from 'gpx';
|
||||
import { get, writable, type Readable } from 'svelte/store';
|
||||
import {
|
||||
import maplibregl, {
|
||||
type MapMouseEvent,
|
||||
type GeoJSONSource,
|
||||
type MapLayerMouseEvent,
|
||||
type MapLayerTouchEvent,
|
||||
Popup,
|
||||
Point,
|
||||
} from 'maplibre-gl';
|
||||
import { route } from './routing';
|
||||
import { toast } from 'svelte-sonner';
|
||||
@@ -52,7 +50,7 @@ export class RoutingControls {
|
||||
}
|
||||
> = new Map();
|
||||
anchors: GeoJSON.Feature<GeoJSON.Point, AnchorProperties>[] = [];
|
||||
popup: Popup;
|
||||
popup: maplibregl.Popup;
|
||||
popupElement: HTMLElement;
|
||||
fileUnsubscribe: () => void = () => {};
|
||||
unsubscribes: Function[] = [];
|
||||
@@ -63,7 +61,7 @@ export class RoutingControls {
|
||||
|
||||
draggedAnchorIndex: number | null = null;
|
||||
lastDraggedAnchorEventTime: number = 0;
|
||||
draggingStartingPosition: Point = new Point(0, 0);
|
||||
draggingStartingPosition: maplibregl.Point = new maplibregl.Point(0, 0);
|
||||
onMouseEnterBinded: () => void = this.onMouseEnter.bind(this);
|
||||
onMouseLeaveBinded: () => void = this.onMouseLeave.bind(this);
|
||||
onClickBinded: (e: MapLayerMouseEvent) => void = this.onClick.bind(this);
|
||||
@@ -82,7 +80,7 @@ export class RoutingControls {
|
||||
constructor(
|
||||
fileId: string,
|
||||
file: Readable<GPXFileWithStatistics | undefined>,
|
||||
popup: Popup,
|
||||
popup: maplibregl.Popup,
|
||||
popupElement: HTMLElement
|
||||
) {
|
||||
this.fileId = fileId;
|
||||
@@ -185,7 +183,7 @@ export class RoutingControls {
|
||||
|
||||
this.layers.forEach((layer, zoom) => {
|
||||
try {
|
||||
let source = map_.getSource(layer.id) as GeoJSONSource | undefined;
|
||||
let source = map_.getSource(layer.id) as maplibregl.GeoJSONSource | undefined;
|
||||
if (source) {
|
||||
source.setData({
|
||||
type: 'FeatureCollection',
|
||||
@@ -522,7 +520,7 @@ export class RoutingControls {
|
||||
});
|
||||
}
|
||||
|
||||
async appendAnchor(e: MapMouseEvent) {
|
||||
async appendAnchor(e: maplibregl.MapMouseEvent) {
|
||||
// Add a new anchor to the end of the last segment
|
||||
if (get(streetViewEnabled) && get(streetViewSource) === 'google') {
|
||||
return;
|
||||
@@ -611,7 +609,7 @@ export class RoutingControls {
|
||||
await this.routeBetweenAnchors([lastAnchor, newAnchor], [lastAnchorPoint, newAnchorPoint]);
|
||||
}
|
||||
|
||||
addIntermediateAnchor(e: MapMouseEvent) {
|
||||
addIntermediateAnchor(e: maplibregl.MapMouseEvent) {
|
||||
e.preventDefault();
|
||||
|
||||
if (this.temporaryAnchor !== null) {
|
||||
|
||||
@@ -8,13 +8,13 @@ import { get } from 'svelte/store';
|
||||
import { fileStateCollection } from '$lib/logic/file-state';
|
||||
import { fileActions } from '$lib/logic/file-actions';
|
||||
import { mapCursor, MapCursorState } from '$lib/logic/map-cursor';
|
||||
import type { Map, GeoJSONSource, MapLayerMouseEvent } from 'maplibre-gl';
|
||||
import type { GeoJSONSource } from 'maplibre-gl';
|
||||
import { ANCHOR_LAYER_KEY } from '$lib/components/map/style';
|
||||
import type { MapLayerEventManager } from '$lib/components/map/map-layer-event-manager';
|
||||
import { loadSVGIcon } from '$lib/utils';
|
||||
|
||||
export class SplitControls {
|
||||
map: Map;
|
||||
map: maplibregl.Map;
|
||||
layerEventManager: MapLayerEventManager;
|
||||
unsubscribes: Function[] = [];
|
||||
|
||||
@@ -22,7 +22,7 @@ export class SplitControls {
|
||||
layerOnMouseLeaveBinded: () => void = this.layerOnMouseLeave.bind(this);
|
||||
layerOnClickBinded: (e: any) => void = this.layerOnClick.bind(this);
|
||||
|
||||
constructor(map: Map, layerEventManager: MapLayerEventManager) {
|
||||
constructor(map: maplibregl.Map, layerEventManager: MapLayerEventManager) {
|
||||
this.map = map;
|
||||
this.layerEventManager = layerEventManager;
|
||||
loadSVGIcon(
|
||||
@@ -160,7 +160,7 @@ export class SplitControls {
|
||||
mapCursor.notify(MapCursorState.SPLIT_CONTROL, false);
|
||||
}
|
||||
|
||||
layerOnClick(e: MapLayerMouseEvent) {
|
||||
layerOnClick(e: maplibregl.MapLayerMouseEvent) {
|
||||
let coordinates = (e.features![0].geometry as GeoJSON.Point).coordinates;
|
||||
fileActions.split(
|
||||
get(splitAs),
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
import { fileActions } from '$lib/logic/file-actions';
|
||||
import { map } from '$lib/components/map/map';
|
||||
import { mapCursor, MapCursorState } from '$lib/logic/map-cursor';
|
||||
import { Marker } from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import { getSvgForSymbol } from '$lib/components/map/gpx-layer/gpx-layer';
|
||||
|
||||
let props: {
|
||||
@@ -41,7 +41,7 @@
|
||||
})
|
||||
);
|
||||
|
||||
let marker: Marker | null = null;
|
||||
let marker: maplibregl.Marker | null = null;
|
||||
|
||||
function reset() {
|
||||
if ($selectedWaypoint) {
|
||||
@@ -125,7 +125,7 @@
|
||||
let element = document.createElement('div');
|
||||
element.classList.add('w-8', 'h-8');
|
||||
element.innerHTML = getSvgForSymbol(symbolKey);
|
||||
marker = new Marker({
|
||||
marker = new maplibregl.Marker({
|
||||
element,
|
||||
anchor: 'bottom',
|
||||
})
|
||||
|
||||
@@ -50,5 +50,5 @@ Um die Ausrichtung und Neigung der Karte zu steuern, können Sie die Karte auch
|
||||
|
||||
### <Maximize2 size="16" class="inline-block" style="margin-bottom: 2px" /> Full screen
|
||||
|
||||
Vollbildmodus ein- oder ausschalten.
|
||||
Du kannst auch <kbd>F11</kbd> drücken, um zu wechseln, oder <kbd>Escape</kbd> zum Beenden.
|
||||
Enter or exit full screen mode.
|
||||
You can also press <kbd>F11</kbd> to toggle, or <kbd>Escape</kbd> to exit.
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
import { writable } from 'svelte/store';
|
||||
|
||||
type Dictionary = {
|
||||
[key: string]: string | Dictionary;
|
||||
};
|
||||
@@ -12,7 +10,6 @@ function getDateFormatter(locale: string) {
|
||||
}
|
||||
|
||||
class Locale {
|
||||
private _store = writable(this);
|
||||
private _lang = $state('');
|
||||
private _isLoadingInitial = $state(true);
|
||||
private _isLoading = $state(true);
|
||||
@@ -41,7 +38,6 @@ class Locale {
|
||||
}
|
||||
import(`../locales/${this._lang}.json`).then((module) => {
|
||||
this.dictionary = module.default;
|
||||
this._store.set(this);
|
||||
if (this._isLoadingInitial) {
|
||||
this._isLoadingInitial = false;
|
||||
}
|
||||
@@ -71,10 +67,6 @@ class Locale {
|
||||
public get df() {
|
||||
return this._df;
|
||||
}
|
||||
|
||||
public subscribe(run: (value: Locale) => void, invalidate?: (value?: Locale) => void) {
|
||||
return this._store.subscribe(run, invalidate);
|
||||
}
|
||||
}
|
||||
|
||||
export const i18n = new Locale();
|
||||
|
||||
@@ -10,6 +10,5 @@ export const languages: Record<string, string> = {
|
||||
nl: 'Nederlands',
|
||||
'pt-BR': 'Português (Brasil)',
|
||||
tr: 'Türkçe',
|
||||
uk: 'Українська',
|
||||
zh: '简体中文',
|
||||
};
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { get } from 'svelte/store';
|
||||
import { selection } from '$lib/logic/selection';
|
||||
import { LngLatBounds } from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import { ListFileItem, ListWaypointItem } from '$lib/components/file-list/file-list';
|
||||
import { fileStateCollection, GPXFileStateCollectionObserver } from '$lib/logic/file-state';
|
||||
import { gpxStatistics } from '$lib/logic/statistics';
|
||||
@@ -10,7 +10,7 @@ import type { Coordinates } from 'gpx';
|
||||
import { page } from '$app/state';
|
||||
|
||||
export class BoundsManager {
|
||||
private _bounds: LngLatBounds = new LngLatBounds();
|
||||
private _bounds: maplibregl.LngLatBounds = new maplibregl.LngLatBounds();
|
||||
private _files: Set<string> = new Set();
|
||||
private _fileStateCollectionObserver: GPXFileStateCollectionObserver | null = null;
|
||||
private _unsubscribes: (() => void)[] = [];
|
||||
@@ -87,12 +87,12 @@ export class BoundsManager {
|
||||
}
|
||||
this._unsubscribes.forEach((unsubscribe) => unsubscribe());
|
||||
this._unsubscribes = [];
|
||||
this._bounds = new LngLatBounds([180, 90, -180, -90]);
|
||||
this._bounds = new maplibregl.LngLatBounds([180, 90, -180, -90]);
|
||||
}
|
||||
|
||||
centerMapOnSelection() {
|
||||
let selected = get(selection).getSelected();
|
||||
let bounds = new LngLatBounds();
|
||||
let bounds = new maplibregl.LngLatBounds();
|
||||
|
||||
if (selected.find((item) => item instanceof ListWaypointItem)) {
|
||||
selection.applyToOrderedSelectedItemsFromFile((fileId, level, items) => {
|
||||
|
||||
@@ -1,16 +1,16 @@
|
||||
import { ListItem, ListLevel } from '$lib/components/file-list/file-list';
|
||||
import { GPXFile, GPXStatistics, GPXStatisticsGroup, type Track } from 'gpx';
|
||||
import { LngLatBounds } from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
|
||||
export class GPXStatisticsTree {
|
||||
level: ListLevel;
|
||||
statistics: {
|
||||
[key: string]: GPXStatisticsTree | GPXStatistics;
|
||||
} = {};
|
||||
wptBounds: LngLatBounds;
|
||||
wptBounds: maplibregl.LngLatBounds;
|
||||
|
||||
constructor(element: GPXFile | Track) {
|
||||
this.wptBounds = new LngLatBounds();
|
||||
this.wptBounds = new maplibregl.LngLatBounds();
|
||||
if (element instanceof GPXFile) {
|
||||
this.level = ListLevel.FILE;
|
||||
element.children.forEach((child, index) => {
|
||||
@@ -49,11 +49,11 @@ export class GPXStatisticsTree {
|
||||
return statistics;
|
||||
}
|
||||
|
||||
intersectsBBox(bounds: LngLatBounds): boolean {
|
||||
intersectsBBox(bounds: maplibregl.LngLatBounds): boolean {
|
||||
for (let key in this.statistics) {
|
||||
const stats = this.statistics[key];
|
||||
if (stats instanceof GPXStatistics) {
|
||||
const bbox = new LngLatBounds(
|
||||
const bbox = new maplibregl.LngLatBounds(
|
||||
stats.global.bounds.southWest,
|
||||
stats.global.bounds.northEast
|
||||
);
|
||||
@@ -67,7 +67,7 @@ export class GPXStatisticsTree {
|
||||
return false;
|
||||
}
|
||||
|
||||
intersectsWaypointBBox(bounds: LngLatBounds): boolean {
|
||||
intersectsWaypointBBox(bounds: maplibregl.LngLatBounds): boolean {
|
||||
return !this.wptBounds.isEmpty() && this.wptBounds.intersects(bounds);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ import { twMerge } from 'tailwind-merge';
|
||||
import { base } from '$app/paths';
|
||||
import { languages } from '$lib/languages';
|
||||
import { TrackPoint, Waypoint, type Coordinates, crossarcDistance, distance, GPXFile } from 'gpx';
|
||||
import { Map as MapLibreMap, LngLatBounds } from 'maplibre-gl';
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import { pointToTile, pointToTileFraction } from '@mapbox/tilebelt';
|
||||
import type { GPXStatisticsTree } from '$lib/logic/statistics-tree';
|
||||
import { ListTrackSegmentItem } from '$lib/components/file-list/file-list';
|
||||
@@ -58,7 +58,7 @@ export function getClosestTrackSegments(
|
||||
let segmentBounds = segmentStatistics.global.bounds;
|
||||
let northEast = segmentBounds.northEast;
|
||||
let southWest = segmentBounds.southWest;
|
||||
let bounds = new LngLatBounds(southWest, northEast);
|
||||
let bounds = new maplibregl.LngLatBounds(southWest, northEast);
|
||||
if (bounds.contains(point)) {
|
||||
segmentBoundsDistances.push([0, trackIndex, segmentIndex]);
|
||||
} else {
|
||||
@@ -106,7 +106,7 @@ export function getElevation(
|
||||
let coordinates = points.map((point) =>
|
||||
point instanceof TrackPoint || point instanceof Waypoint ? point.getCoordinates() : point
|
||||
);
|
||||
let bbox = new LngLatBounds();
|
||||
let bbox = new maplibregl.LngLatBounds();
|
||||
coordinates.forEach((coord) => bbox.extend(coord));
|
||||
|
||||
let tiles = coordinates.map((coord) => pointToTile(coord.lon, coord.lat, ELEVATION_ZOOM));
|
||||
@@ -193,7 +193,7 @@ export function getElevation(
|
||||
);
|
||||
}
|
||||
|
||||
export function loadSVGIcon(map: MapLibreMap, id: string, svg: string, size: number = 100) {
|
||||
export function loadSVGIcon(map: maplibregl.Map, id: string, svg: string, size: number = 100) {
|
||||
if (!map.hasImage(id)) {
|
||||
let icon = new Image(size, size);
|
||||
icon.onload = () => {
|
||||
|
||||
@@ -36,7 +36,7 @@
|
||||
"switch_basemap": "Zur vorherigen Basemap wechseln",
|
||||
"toggle_overlays": "Overlay umschalten",
|
||||
"toggle_3d": "3D umschalten",
|
||||
"fullscreen": "Vollbildmodus",
|
||||
"fullscreen": "Full screen",
|
||||
"settings": "Einstellungen",
|
||||
"distance_units": "Entfernungseinheiten",
|
||||
"metric": "Metrisch",
|
||||
@@ -235,7 +235,7 @@
|
||||
},
|
||||
"elevation": {
|
||||
"button": "Höhendaten anfragen",
|
||||
"help": "Das Anfordern von Höhendaten löscht die vorhandenen Höhendaten, falls vorhanden, und ersetzt diese durch Daten von Mapterhorn.",
|
||||
"help": "Requesting elevation data will erase the existing elevation data, if any, and replace it with data from Mapterhorn.",
|
||||
"help_no_selection": "Wählen Sie ein Datei-Element, um Höhendaten anzufordern."
|
||||
},
|
||||
"waypoint": {
|
||||
@@ -305,7 +305,7 @@
|
||||
"united_kingdom": "Großbritannien",
|
||||
"united_states": "USA",
|
||||
"libertyTopo": "Liberty Topo",
|
||||
"libertySatellite": "Liberty Satellit",
|
||||
"libertySatellite": "Liberty Satellite",
|
||||
"osm": "OpenMapTiles OSM",
|
||||
"osmTopo": "OpenMapTiles OSM Topo",
|
||||
"esriSatellite": "Esri Satellite",
|
||||
|
||||
+18
-18
@@ -36,7 +36,7 @@
|
||||
"switch_basemap": "Aldatu aurreko mapa erabiltzera",
|
||||
"toggle_overlays": "Txandakatu geruzak",
|
||||
"toggle_3d": "Txandakatu 3D",
|
||||
"fullscreen": "Pantaila osoa",
|
||||
"fullscreen": "Full screen",
|
||||
"settings": "Ezarpenak",
|
||||
"distance_units": "Distantzia unitateak",
|
||||
"metric": "Metrikoa",
|
||||
@@ -64,7 +64,7 @@
|
||||
"ctrl": "Ctrl",
|
||||
"click": "Klik",
|
||||
"drag": "Arrastatu",
|
||||
"right_click_drag": "Eskuin klik eta errestan eraman",
|
||||
"right_click_drag": "Right-click drag",
|
||||
"metadata": {
|
||||
"button": "Informazioa...",
|
||||
"name": "Izena",
|
||||
@@ -192,8 +192,8 @@
|
||||
"from": "Hasiera puntua errepide hurbilenetik oso hurrun dago",
|
||||
"via": "Puntua errepide hurbilenetik oso hurrun dago",
|
||||
"to": "Bukaera puntua errepide hurbilenetik oso hurrun dago",
|
||||
"distance": "Bukaera-puntua hasiera-puntutik urrutiegi dago",
|
||||
"connection": "Ez da konexiorik topatu puntuen artean",
|
||||
"distance": "The end point is too far from the start point",
|
||||
"connection": "No connection found between the points",
|
||||
"timeout": "Ibilbidea kalkulatzea luzeegi joan da, saiatu hurbilago dauden puntuak gehitzen"
|
||||
}
|
||||
},
|
||||
@@ -235,7 +235,7 @@
|
||||
},
|
||||
"elevation": {
|
||||
"button": "Eskatu altueraren datuak",
|
||||
"help": "Kota-datuak eskatzeak lehendik dauden kota-datuak ezabatuko ditu, halakorik balego, eta Mapterhorn-eko datuekin ordezkatuko dira.",
|
||||
"help": "Requesting elevation data will erase the existing elevation data, if any, and replace it with data from Mapterhorn.",
|
||||
"help_no_selection": "Aukeratu fitxategi bat altuera datuak eskatzeko."
|
||||
},
|
||||
"waypoint": {
|
||||
@@ -277,7 +277,7 @@
|
||||
"new": "Geruza pertsonalizatu berria",
|
||||
"edit": "Editatu geruza pertsonalizatua",
|
||||
"urls": "URLa(k)",
|
||||
"url_placeholder": "WMTS, WMS edo MapLibre estiloko JSON",
|
||||
"url_placeholder": "WMTS, WMS or MapLibre style JSON",
|
||||
"max_zoom": "Zoom max",
|
||||
"layer_type": "Geruza mota",
|
||||
"basemap": "Oinarrizko-mapa",
|
||||
@@ -305,7 +305,7 @@
|
||||
"united_kingdom": "Erresuma Batua",
|
||||
"united_states": "Ameriketako Estatu Batuak",
|
||||
"libertyTopo": "Liberty Topo",
|
||||
"libertySatellite": "Liberty Satelitea",
|
||||
"libertySatellite": "Liberty Satellite",
|
||||
"osm": "OpenMapTiles OSM",
|
||||
"osmTopo": "OpenMapTiles OSM Topo",
|
||||
"esriSatellite": "Esri Satellite",
|
||||
@@ -494,7 +494,7 @@
|
||||
"email": "Eposta",
|
||||
"contribute": "Lagundu",
|
||||
"supported_by": "hauek lagunduta",
|
||||
"features": "Funtzioak",
|
||||
"features": "Features",
|
||||
"route_planning": "Bideak planifikatzea",
|
||||
"route_planning_description": "OpenStreetMapen datuetan oinarritutako interfaze erabilterraza kirol bakoitzerako ibilbideak sortzeko.",
|
||||
"file_processing": "Fitxategien prozesaketa aurreratua",
|
||||
@@ -503,15 +503,15 @@
|
||||
"maps_description": "Oinarrizko mapa, geruza eta interes-puntuen bilduma zabala. Zure aire-libreko ekintzak planifikatzen lagunduko dizu!",
|
||||
"data_visualization": "Datuak bistaratzea",
|
||||
"data_visualization_description": "Grabatutako ekintzak edo etorkizuneko zure bideak aztertzeko altuera-profil interaktiboa.",
|
||||
"philosophy": "Filosofia",
|
||||
"foss": "Doakoa, propagandarik gabe eta kode irekikoa",
|
||||
"foss_description": "Webgunea doakoa da, iragarkirik gabe, eta iturburu-kodea publikoki eskuragarri dago GitHub-en.",
|
||||
"privacy": "Pribatutasuna zaintzen du",
|
||||
"privacy_description": "Zure GPX fitxategiak ez dira inoiz zure nabigatzailetik irteten. Ez dago jarraipenik, ez datu-bilketarik.",
|
||||
"community": "Komunitateak posible egin du",
|
||||
"community_description": "gpx.studio-k komunitate harrigarri bat du, urte luzez dohaintzen bidez bere kostuak estali dituena, proiektuaren ezaugarri-iradokizunen, akatsen txostenen eta hizkuntza askotarako itzulpenen bidez moldatu dena.",
|
||||
"support_button": "Lagundu gpx.studio Open Collectiveren bidez",
|
||||
"translate_button": "Lagundu webgunea itzultzen Crowdin-en"
|
||||
"philosophy": "Philosophy",
|
||||
"foss": "Free, ad-free and open source",
|
||||
"foss_description": "The website is free to use, without ads, and the source code is publicly available on GitHub.",
|
||||
"privacy": "Privacy-friendly",
|
||||
"privacy_description": "Your GPX files never leave your browser. No tracking, no data collection.",
|
||||
"community": "Made possible by the community",
|
||||
"community_description": "gpx.studio has an amazing community that has covered its costs through donations for years, while shaping the project through feature suggestions, bug reports, and translations into many languages.",
|
||||
"support_button": "Support gpx.studio on Open Collective",
|
||||
"translate_button": "Help translate the website on Crowdin"
|
||||
},
|
||||
"docs": {
|
||||
"translate": "Lagundu itzulpenarekin Crowdinen",
|
||||
@@ -536,7 +536,7 @@
|
||||
},
|
||||
"embedding": {
|
||||
"title": "Sortu zure mapa",
|
||||
"maptiler_key": "MapTiler gakoa (aukeran, bakarrik behar da MapTiler mapetan)",
|
||||
"maptiler_key": "MapTiler key (optional, only required for MapTiler maps)",
|
||||
"file_urls": "Fitxategien URLak (komarekin banatuta)",
|
||||
"drive_ids": "Google Drive fitxategien IDak (komarekin banatuta)",
|
||||
"basemap": "Oinarrizko-mapa",
|
||||
|
||||
Reference in New Issue
Block a user