Add Native Leaflet Retina Support for Raster Tiles

[acalcutt]

Add Native Leaflet Retina Support for Raster Tiles

Description

This PR updates the Handlebars templates and server configuration to properly support Retina (High-DPI) displays on the Leaflet-based raster map viewer using TileServer-GL's native @2x rendering capabilities.

Previously, the templates contained obsolete layer.scalePrefix code intended for older versions of mapbox.js. Simply enabling Leaflet's detectRetina: true causes Leaflet to attempt fetching four tiles from the z+1 zoom level, which can put unnecessary strain on the server, create rendering inconsistencies (smaller labels), and potentially fetch tiles beyond max zoom bounds, breaking the view.

Instead, this PR dynamically injects Leaflet's {r} modifier into the viewer.tmpl TileJSON endpoint string, elegantly translating the tile requests directly into TileServer-GL's native high-resolution @2x rendered endpoints (/{z}/{x}/{y}@2x.png instead of /{z}/{x}/{y}.png).

Changes

• public/templates/data.tmpl: Removed obsolete layer.scalePrefix logic. Ensured retina is completely disabled here because the raw data endpoint does not generate raster-scaled outputs, avoiding 404s and zooming bugs.
• public/templates/viewer.tmpl: Removed obsolete mapbox.js code. Dynamically injects the {r} tag into the raster rendering URL so Leaflet properly pulls @2x endpoints instead of shifting zoom levels.
• src/server.js: Added the leafletRetina option, defaulting to false (to preserve existing behavior while allowing opt-in testing).
• docs/config.rst: Documented the new leafletRetina configuration option.

Motivation and Context

Native rendering of High DPI output provides significantly better maps on modern devices without requiring the client browser to cobble together mismatched zoom levels.
However, because this natively causes the server to generate larger images (@2x), it can use extra CPU/Memory resources. To preserve current behavior and ensure stability, this option is disabled by default.

To use it, an administrator must dynamically opt-in by setting "leafletRetina": true within their config.json options.

Testing Instructions

1. Run tileserver without leafletRetina explicitly set to true. Verify the current behavior works exactly as before.
2. Under options in config.json, add "leafletRetina": true and restart the server.
3. Load a raster view on a High-DPI display, observe the higher quality images using the @2x endpoint in the network tab.
4. Open the data view and verify that normal vector/raw tiles still load correctly without attempting retina upscaling.

[Copilot]

Pull request overview

Adds an opt-in configuration flag to enable high-DPI (“Retina”) raster rendering in the Leaflet-based viewer by translating requests to TileServer-GL’s native @2x tile endpoints, while removing legacy mapbox.js-era retina code from the templates.

Changes:

• Injects Leaflet’s {r} modifier into rendered raster tile URLs in the raster viewer template when leafletRetina is enabled.
• Removes obsolete layer.scalePrefix logic from the viewer and data templates.
• Exposes leafletRetina from server options to templates and documents it in configuration docs.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File	Description
src/server.js	Passes leafletRetina config into Handlebars template data as leaflet_retina.
public/templates/viewer.tmpl	Conditionally injects {r} into raster tile URL templates to enable @2x fetching.
public/templates/data.tmpl	Removes legacy scalePrefix code from the data viewer template.
docs/config.rst	Documents the new leafletRetina configuration option and its default.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.