From e8545656f7fa5063e1547353872247303c64b42c Mon Sep 17 00:00:00 2001 From: HikeMap User Date: Sat, 10 Jan 2026 18:46:19 -0600 Subject: [PATCH] Add MapLibre GL JS test page for custom map styling MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Test page at /maplibre-test.html for evaluating MapLibre migration - 5 pre-made styles: Liberty, Positron, Dark Matter, Bright, Custom Fantasy - Custom Fantasy allows picking colors for land, water, roads, buildings, parks - 3D extruded buildings option with pitch/bearing controls - Uses free OpenFreeMap vector tiles (no API key needed) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 --- docker-compose.yml | 1 + maplibre-test.html | 624 +++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 625 insertions(+) create mode 100644 maplibre-test.html diff --git a/docker-compose.yml b/docker-compose.yml index fd159a4..7562686 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -6,6 +6,7 @@ services: volumes: - ./index.html:/app/index.html:ro - ./admin.html:/app/admin.html:ro + - ./maplibre-test.html:/app/maplibre-test.html:ro - ./server.js:/app/server.js:ro - ./database.js:/app/database.js:ro - ./service-worker.js:/app/service-worker.js:ro diff --git a/maplibre-test.html b/maplibre-test.html new file mode 100644 index 0000000..7c64c7c --- /dev/null +++ b/maplibre-test.html @@ -0,0 +1,624 @@ + + + + + + MapLibre Test - HikeMap + + + + + +
+ +
+

MapLibre Style Test

+ +
+
Pre-made Styles
+ + + + + + + + + + +
+ +
+
Custom Colors
+ +
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ +
+ +
+ + +
+ +
+
3D Controls
+ +
+ + + 0° +
+ +
+ + + 0° +
+
+ +
+ What you're seeing: + Vector tiles rendered client-side. Every color, label, and feature can be customized via style JSON. +

+ Controls: + • Drag to pan + • Scroll to zoom + • Right-drag to rotate/tilt + • Ctrl+drag to pitch +
+
+ + + +