+
{#if showControls}
diff --git a/website/src/lib/components/elevation-profile/elevation-profile.ts b/website/src/lib/components/elevation-profile/elevation-profile.ts
index 54b398139..4aa8b969f 100644
--- a/website/src/lib/components/elevation-profile/elevation-profile.ts
+++ b/website/src/lib/components/elevation-profile/elevation-profile.ts
@@ -20,10 +20,8 @@ import Chart, {
type ScriptableLineSegmentContext,
type TooltipItem,
} from 'chart.js/auto';
-import mapboxgl from 'mapbox-gl';
import { get, type Readable, type Writable } from 'svelte/store';
-import { map } from '$lib/components/map/map';
-import type { GPXGlobalStatistics, GPXStatisticsGroup } from 'gpx';
+import type { Coordinates, GPXGlobalStatistics, GPXStatisticsGroup } from 'gpx';
import { mode } from 'mode-watcher';
import { getHighwayColor, getSlopeColor, getSurfaceColor } from '$lib/assets/colors';
@@ -42,7 +40,7 @@ interface ElevationProfilePoint {
length: number;
};
extensions: Record
;
- coordinates: [number, number];
+ coordinates: Coordinates;
index: number;
}
@@ -50,18 +48,19 @@ export class ElevationProfile {
private _chart: Chart | null = null;
private _canvas: HTMLCanvasElement;
private _overlay: HTMLCanvasElement;
- private _marker: mapboxgl.Marker | null = null;
private _dragging = false;
private _panning = false;
private _gpxStatistics: Readable;
private _slicedGPXStatistics: Writable<[GPXGlobalStatistics, number, number] | undefined>;
+ private _hoveredPoint: Writable;
private _additionalDatasets: Readable;
private _elevationFill: Readable<'slope' | 'surface' | 'highway' | undefined>;
constructor(
gpxStatistics: Readable,
slicedGPXStatistics: Writable<[GPXGlobalStatistics, number, number] | undefined>,
+ hoveredPoint: Writable,
additionalDatasets: Readable,
elevationFill: Readable<'slope' | 'surface' | 'highway' | undefined>,
canvas: HTMLCanvasElement,
@@ -69,17 +68,12 @@ export class ElevationProfile {
) {
this._gpxStatistics = gpxStatistics;
this._slicedGPXStatistics = slicedGPXStatistics;
+ this._hoveredPoint = hoveredPoint;
this._additionalDatasets = additionalDatasets;
this._elevationFill = elevationFill;
this._canvas = canvas;
this._overlay = overlay;
- let element = document.createElement('div');
- element.className = 'h-4 w-4 rounded-full bg-cyan-500 border-2 border-white';
- this._marker = new mapboxgl.Marker({
- element,
- });
-
import('chartjs-plugin-zoom').then((module) => {
Chart.register(module.default);
this.initialize();
@@ -162,14 +156,10 @@ export class ElevationProfile {
label: (context: TooltipItem<'line'>) => {
let point = context.raw as ElevationProfilePoint;
if (context.datasetIndex === 0) {
- const map_ = get(map);
- if (map_ && this._marker) {
- if (this._dragging) {
- this._marker.remove();
- } else {
- this._marker.setLngLat(point.coordinates);
- this._marker.addTo(map_);
- }
+ if (this._dragging) {
+ this._hoveredPoint.set(null);
+ } else {
+ this._hoveredPoint.set(point.coordinates);
}
return `${i18n._('quantities.elevation')}: ${getElevationWithUnits(point.y, false)}`;
} else if (context.datasetIndex === 1) {
@@ -312,10 +302,7 @@ export class ElevationProfile {
events: ['mouseout'],
afterEvent: (chart: Chart, args: { event: ChartEvent }) => {
if (args.event.type === 'mouseout') {
- const map_ = get(map);
- if (map_ && this._marker) {
- this._marker.remove();
- }
+ this._hoveredPoint.set(null);
}
},
},
@@ -637,8 +624,5 @@ export class ElevationProfile {
this._chart.destroy();
this._chart = null;
}
- if (this._marker) {
- this._marker.remove();
- }
}
}
diff --git a/website/src/lib/components/embedding/Embedding.svelte b/website/src/lib/components/embedding/Embedding.svelte
index 48d0bd931..bba44c349 100644
--- a/website/src/lib/components/embedding/Embedding.svelte
+++ b/website/src/lib/components/embedding/Embedding.svelte
@@ -16,7 +16,7 @@
import { setMode } from 'mode-watcher';
import { settings } from '$lib/logic/settings';
import { fileStateCollection } from '$lib/logic/file-state';
- import { gpxStatistics, slicedGPXStatistics } from '$lib/logic/statistics';
+ import { gpxStatistics, hoveredPoint, slicedGPXStatistics } from '$lib/logic/statistics';
import { loadFile } from '$lib/logic/file-actions';
import { selection } from '$lib/logic/selection';
import { untrack } from 'svelte';
@@ -102,7 +102,7 @@
-
-
-
-
- ❤️ {i18n._('homepage.supported_by')}
-
-
-
-
-
- {#await data.mapboxModule then mapboxModule}
-
- {/await}
-
-
{#if $elevationProfile}
diff --git a/website/static/mapbox-logo-black.svg b/website/static/mapbox-logo-black.svg
deleted file mode 100644
index a0cbd94d5..000000000
--- a/website/static/mapbox-logo-black.svg
+++ /dev/null
@@ -1,38 +0,0 @@
-
-
-
diff --git a/website/static/mapbox-logo-white.svg b/website/static/mapbox-logo-white.svg
deleted file mode 100644
index 8d62aef0e..000000000
--- a/website/static/mapbox-logo-white.svg
+++ /dev/null
@@ -1,42 +0,0 @@
-
-
-
diff --git a/website/static/maptiler-logo-dark.svg b/website/static/maptiler-logo-dark.svg
new file mode 100644
index 000000000..2f60017f2
--- /dev/null
+++ b/website/static/maptiler-logo-dark.svg
@@ -0,0 +1,47 @@
+
+
+
diff --git a/website/static/maptiler-logo.svg b/website/static/maptiler-logo.svg
new file mode 100644
index 000000000..626f9f69b
--- /dev/null
+++ b/website/static/maptiler-logo.svg
@@ -0,0 +1,45 @@
+
+
+
{:else if company === 'github'}
diff --git a/website/src/lib/components/docs/DocsLayers.svelte b/website/src/lib/components/docs/DocsLayers.svelte
index 4c5abadc7..ba6e46ba3 100644
--- a/website/src/lib/components/docs/DocsLayers.svelte
+++ b/website/src/lib/components/docs/DocsLayers.svelte
@@ -1,10 +1,10 @@