owain/MileVault
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: route tiles use Thunderforest Outdoors map style (dense labels, paths, contours)
Build and push images / validate (push) Successful in 3s
Details
Build and push images / build-backend (push) Successful in 5s
Details
Build and push images / build-worker (push) Successful in 5s
Details
Build and push images / build-frontend (push) Successful in 9s
Details

Browse Source
This commit is contained in:
owain
2026-06-23 12:17:13 +01:00
parent 0901ed0ef3
commit deecf668d2
1 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/ui/RouteTileMap.jsx
+5 -3
View File
@@ -2,8 +2,10 @@ import { useEffect, useRef } from 'react'
import L from 'leaflet' import L from 'leaflet'
import { sportColor } from '../../utils/format' import { sportColor } from '../../utils/format'
// OpenStreetMap standard raster — denser street/place labels than Carto Voyager. // Thunderforest Outdoors raster — topo style with dense place/street labels,
const TILE_URL = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png' // paths and contours. The apikey is a client-side tile key (public by nature).
const THUNDERFOREST_KEY = '872984f587484873a74ea454662ffacb'
const TILE_URL = `https://{s}.tile.thunderforest.com/outdoors/{z}/{x}/{y}.png?apikey=${THUNDERFOREST_KEY}`
function decodePolyline(encoded) { function decodePolyline(encoded) {
if (!encoded) return [] if (!encoded) return []
@@ -38,7 +40,7 @@ export default function RouteTileMap({ polyline, sportType, className = '' }) {
zoomSnap: 0, zoomSnap: 0,
}) })
mapRef.current = map mapRef.current = map
L.tileLayer(TILE_URL, { maxZoom: 19, subdomains: 'abc' }).addTo(map) L.tileLayer(TILE_URL, { maxZoom: 22, subdomains: 'abc' }).addTo(map)
return () => { map.remove(); mapRef.current = null } return () => { map.remove(); mapRef.current = null }
}, []) }, [])