|
|
@ -23,12 +23,28 @@ licenses/by-sa/2.0/">CC-BY-SA</a>`, |
|
|
|
//
|
|
|
|
// TAM
|
|
|
|
|
|
|
|
const makeBorderColor = mainColor => |
|
|
|
{ |
|
|
|
const hsl = color(mainColor).hsl(); |
|
|
|
|
|
|
|
if (hsl.color[2] < 40) |
|
|
|
{ |
|
|
|
hsl.color[2] += 30; |
|
|
|
} |
|
|
|
else |
|
|
|
{ |
|
|
|
hsl.color[2] -= 20; |
|
|
|
} |
|
|
|
|
|
|
|
return hsl.hex(); |
|
|
|
}; |
|
|
|
|
|
|
|
const SERVER = 'http://localhost:3000'; |
|
|
|
const SERVER = window.origin; |
|
|
|
|
|
|
|
fetch(SERVER + '/line/6').then(res => res.json()).then(line => |
|
|
|
fetch(SERVER + '/line/1').then(res => res.json()).then(line => |
|
|
|
{ |
|
|
|
const color = line.color; |
|
|
|
const borderColor = makeBorderColor(color); |
|
|
|
|
|
|
|
line.routes.forEach(route => |
|
|
|
{ |
|
|
@ -36,7 +52,7 @@ fetch(SERVER + '/line/6').then(res => res.json()).then(line => |
|
|
|
{ |
|
|
|
const wayPoints = way.map(({lat, lon}) => [lat, lon]); |
|
|
|
|
|
|
|
L.polyline(wayPoints, {weight: 8, color: '#888'}).addTo(map); |
|
|
|
L.polyline(wayPoints, {weight: 8, color: borderColor}).addTo(map); |
|
|
|
L.polyline(wayPoints, {weight: 6, color}).addTo(map); |
|
|
|
}); |
|
|
|
}); |
|
|
@ -51,7 +67,7 @@ fetch(SERVER + '/line/6').then(res => res.json()).then(line => |
|
|
|
fillColor: color, |
|
|
|
radius: 6, |
|
|
|
fillOpacity: 1, |
|
|
|
color: '#888', |
|
|
|
color: borderColor, |
|
|
|
weight: 2 |
|
|
|
} |
|
|
|
).addTo(map); |
|
|
|