From 1fe1d13c600b7dfe421b3b99b833b7d5d1232724 Mon Sep 17 00:00:00 2001 From: Dennis Fink Date: Thu, 23 Jul 2026 00:18:21 +0200 Subject: Add GPX trail maps to blog posts This adds a trail flow block so posts can include attached GPX files as interactive maps with route display, elevation charts, activity summaries, and start/finish markers. The trail assets are loaded only when needed, keeping the shared templates clean while vendoring the Leaflet dependencies required for offline, self-hosted map rendering. --- .../leaflet-elevation/src/handlers/labels.js | 45 ++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 assets/static/vendor/leaflet-elevation/src/handlers/labels.js (limited to 'assets/static/vendor/leaflet-elevation/src/handlers/labels.js') diff --git a/assets/static/vendor/leaflet-elevation/src/handlers/labels.js b/assets/static/vendor/leaflet-elevation/src/handlers/labels.js new file mode 100644 index 0000000..31b3cd6 --- /dev/null +++ b/assets/static/vendor/leaflet-elevation/src/handlers/labels.js @@ -0,0 +1,45 @@ +/** + * @see https://github.com/Raruto/leaflet-elevation/issues/211 + * + * @example + * ```js + * L.control.Elevation({ handlers: [ 'Labels' ], labelsRotation: 25, labelsAlign: 'start' }) + * ``` + */ +export function Labels() { + + this.on('elechart_updated', function(e) { + + const pointG = this._chart._chart.pane('point'); + + const textRotation = this.options.labelsRotation ?? -90; + const textAnchor = this.options.labelsAlign; + + if (90 == Math.abs(textRotation)) { + + pointG.selectAll('text') + .attr('dy', '4px') + .attr("dx", (d, i, el) => Math.sign(textRotation) * (this._height() - d3.select(el[i].parentElement).datum().y - 8) + 'px') + .attr('text-anchor', textRotation > 0 ? 'end' : 'start') + .attr('transform', 'rotate(' + textRotation + ')') + + pointG.selectAll('circle') + .attr('r', '2.5') + .attr('fill', '#fff') + .attr("stroke", '#000') + .attr("stroke-width", '1.1'); + + } else if (!isNaN(textRotation)) { + + pointG.selectAll('text') + .attr("dx", "4px") + .attr("dy", "-9px") + .attr('text-anchor', textAnchor ?? (0 == textRotation ? 'start' : 'middle')) + .attr('transform', 'rotate('+ -textRotation +')') + + } + + }); + + return { }; +} -- cgit v1.3.1