From a9c9c6bc469023f722225e5dca917ebad6a5e5df Mon Sep 17 00:00:00 2001 From: Jan-Lukas Else Date: Sun, 3 Jul 2022 09:53:53 +0200 Subject: [PATCH] Use random colors for track paths on map page --- templates/assets/js/geomap.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/templates/assets/js/geomap.js b/templates/assets/js/geomap.js index f489491..6f0e65a 100644 --- a/templates/assets/js/geomap.js +++ b/templates/assets/js/geomap.js @@ -1,4 +1,13 @@ (function () { + function randomColor() { + // Generate a random but valid HEX color value + let color = '#' + for (let i = 0; i < 3; i++) { + color += Math.floor(Math.random() * 256).toString(16) + } + return color + } + function loadMap() { // Get the map element let mapEl = document.getElementById('map') @@ -31,7 +40,8 @@ }) tracks.forEach(track => { track.Paths.forEach(path => { - features.push(L.polyline(path.map(point => [point.Lat, point.Lon]), { color: 'blue' }).addTo(map).on('click', function () { + // Use random color on map page for paths to better differentiate + features.push(L.polyline(path.map(point => [point.Lat, point.Lon]), { color: randomColor() }).addTo(map).on('click', function () { window.open(track.Post, '_blank').focus() })) })