mirror of
https://github.com/Findus23/RainbowRoad.git
synced 2024-09-19 16:03:52 +02:00
better routing
This commit is contained in:
parent
ce98f31056
commit
012ea9390c
11 changed files with 189 additions and 196 deletions
|
@ -53,6 +53,10 @@ async function runfetch(filename: string) {
|
||||||
|
|
||||||
if (typeof d.geo !== "undefined") {
|
if (typeof d.geo !== "undefined") {
|
||||||
d.geo.length = lineLengthInM(d.geo.coords[0], d.geo.coords[1])
|
d.geo.length = lineLengthInM(d.geo.coords[0], d.geo.coords[1])
|
||||||
|
if (d.id < 100) {
|
||||||
|
const max = 2 ** 32
|
||||||
|
d.id = Math.floor(Math.random() * max);
|
||||||
|
}
|
||||||
continue
|
continue
|
||||||
}
|
}
|
||||||
const geosource = d.geosource
|
const geosource = d.geosource
|
||||||
|
@ -77,6 +81,8 @@ async function runfetch(filename: string) {
|
||||||
// crossings[i] = d
|
// crossings[i] = d
|
||||||
fs.writeFileSync(filename, JSON.stringify(data, null, 2))
|
fs.writeFileSync(filename, JSON.stringify(data, null, 2))
|
||||||
}
|
}
|
||||||
|
fs.writeFileSync(filename, JSON.stringify(data, null, 2))
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
fs.readdirSync("../data/").forEach(file => {
|
fs.readdirSync("../data/").forEach(file => {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 2160025690,
|
||||||
"name": "Nordico",
|
"name": "Nordico",
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
"sources": [
|
"sources": [
|
||||||
|
@ -29,7 +29,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 2057144734,
|
||||||
"name": "Mozartkreuzung 1/2",
|
"name": "Mozartkreuzung 1/2",
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
"set": "Mozartkreuzung",
|
"set": "Mozartkreuzung",
|
||||||
|
@ -59,7 +59,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 712336288,
|
||||||
"name": "Mozartkreuzung 2/2",
|
"name": "Mozartkreuzung 2/2",
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
"set": "Mozartkreuzung",
|
"set": "Mozartkreuzung",
|
||||||
|
@ -89,7 +89,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 4,
|
"id": 3393664309,
|
||||||
"name": "Grieskirchen",
|
"name": "Grieskirchen",
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
"sources": [
|
"sources": [
|
||||||
|
@ -129,7 +129,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 5,
|
"id": 762490778,
|
||||||
"name": "Bad Ischl",
|
"name": "Bad Ischl",
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
"sources": [
|
"sources": [
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
[
|
[
|
||||||
{
|
{
|
||||||
"id": 1,
|
"id": 1740508417,
|
||||||
"name": "Praterstern",
|
"name": "Praterstern",
|
||||||
"sources": [
|
"sources": [
|
||||||
{
|
{
|
||||||
|
@ -34,7 +34,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 2,
|
"id": 1650233937,
|
||||||
"name": "Spitalgasse/Lazarettgasse",
|
"name": "Spitalgasse/Lazarettgasse",
|
||||||
"bezirk": 9,
|
"bezirk": 9,
|
||||||
"type": "transFlag",
|
"type": "transFlag",
|
||||||
|
@ -72,7 +72,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 3,
|
"id": 83431426,
|
||||||
"name": "Gumpendorfer Straße/Kaunitzgasse",
|
"name": "Gumpendorfer Straße/Kaunitzgasse",
|
||||||
"bezirk": 6,
|
"bezirk": 6,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -107,7 +107,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 4,
|
"id": 4288760626,
|
||||||
"name": "Schönbrunner Straße/Pilgramgasse",
|
"name": "Schönbrunner Straße/Pilgramgasse",
|
||||||
"bezirk": 5,
|
"bezirk": 5,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -142,7 +142,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 5,
|
"id": 2780254397,
|
||||||
"name": "Burgtheater/Rathausplatz",
|
"name": "Burgtheater/Rathausplatz",
|
||||||
"bezirk": 1,
|
"bezirk": 1,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -178,7 +178,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 6,
|
"id": 2774137854,
|
||||||
"name": "Meidlinger Markt",
|
"name": "Meidlinger Markt",
|
||||||
"bezirk": 12,
|
"bezirk": 12,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -217,7 +217,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 7,
|
"id": 1063544959,
|
||||||
"name": "Laaer-Berg-Straße",
|
"name": "Laaer-Berg-Straße",
|
||||||
"bezirk": 10,
|
"bezirk": 10,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -262,7 +262,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 8,
|
"id": 1521482113,
|
||||||
"name": "Währinger Straße/Kutschkermarkt",
|
"name": "Währinger Straße/Kutschkermarkt",
|
||||||
"bezirk": 18,
|
"bezirk": 18,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -301,7 +301,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 9,
|
"id": 3958225692,
|
||||||
"name": "Landstraßer Hauptstraße",
|
"name": "Landstraßer Hauptstraße",
|
||||||
"bezirk": 3,
|
"bezirk": 3,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -332,7 +332,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 10,
|
"id": 1346655170,
|
||||||
"name": "Operngasse/Schleifmühlgasse",
|
"name": "Operngasse/Schleifmühlgasse",
|
||||||
"bezirk": 4,
|
"bezirk": 4,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -371,7 +371,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 11,
|
"id": 862021905,
|
||||||
"name": "Schönbrunner Straße/Ramperstorffergasse",
|
"name": "Schönbrunner Straße/Ramperstorffergasse",
|
||||||
"bezirk": 5,
|
"bezirk": 5,
|
||||||
"type": "transFlag",
|
"type": "transFlag",
|
||||||
|
@ -406,7 +406,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 12,
|
"id": 151167188,
|
||||||
"name": "Kennedybrücke/Hietzinger Hauptstraße",
|
"name": "Kennedybrücke/Hietzinger Hauptstraße",
|
||||||
"bezirk": 13,
|
"bezirk": 13,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -440,7 +440,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 13,
|
"id": 1238371047,
|
||||||
"name": "Kennedybrücke/Hadikgasse",
|
"name": "Kennedybrücke/Hadikgasse",
|
||||||
"bezirk": 14,
|
"bezirk": 14,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -473,7 +473,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 14,
|
"id": 232762522,
|
||||||
"name": "Simmeringer Platz",
|
"name": "Simmeringer Platz",
|
||||||
"bezirk": 11,
|
"bezirk": 11,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -507,7 +507,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 15,
|
"id": 3922122587,
|
||||||
"name": "Mauer Hauptplatz",
|
"name": "Mauer Hauptplatz",
|
||||||
"bezirk": 23,
|
"bezirk": 23,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -541,7 +541,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 16,
|
"id": 2105989939,
|
||||||
"name": "Elterleinplatz/Kalvarienberggasse",
|
"name": "Elterleinplatz/Kalvarienberggasse",
|
||||||
"bezirk": 17,
|
"bezirk": 17,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -575,7 +575,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 17,
|
"id": 41666860,
|
||||||
"name": "Rennweg",
|
"name": "Rennweg",
|
||||||
"bezirk": 3,
|
"bezirk": 3,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -615,7 +615,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 18,
|
"id": 3932188971,
|
||||||
"name": "Museumsquartier",
|
"name": "Museumsquartier",
|
||||||
"bezirk": 1,
|
"bezirk": 1,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -651,7 +651,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 19,
|
"id": 1010081192,
|
||||||
"name": "Pilgrambrücke/Linke Wienzeile",
|
"name": "Pilgrambrücke/Linke Wienzeile",
|
||||||
"bezirk": 6,
|
"bezirk": 6,
|
||||||
"type": "transFlag",
|
"type": "transFlag",
|
||||||
|
@ -686,7 +686,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 20,
|
"id": 3012718795,
|
||||||
"name": "Floridsdorfer Spitz 1/3",
|
"name": "Floridsdorfer Spitz 1/3",
|
||||||
"bezirk": 21,
|
"bezirk": 21,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -721,7 +721,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 21,
|
"id": 999941480,
|
||||||
"name": "Floridsdorfer Spitz 2/3",
|
"name": "Floridsdorfer Spitz 2/3",
|
||||||
"bezirk": 21,
|
"bezirk": 21,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -756,7 +756,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 22,
|
"id": 1502936995,
|
||||||
"name": "Floridsdorfer Spitz 3/3",
|
"name": "Floridsdorfer Spitz 3/3",
|
||||||
"bezirk": 21,
|
"bezirk": 21,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -796,7 +796,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 23,
|
"id": 4228588348,
|
||||||
"name": "Josefstädter Straße/Albertgasse 1/3",
|
"name": "Josefstädter Straße/Albertgasse 1/3",
|
||||||
"bezirk": 8,
|
"bezirk": 8,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -827,7 +827,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 24,
|
"id": 695015193,
|
||||||
"name": "Josefstädter Straße/Albertgasse 2/3",
|
"name": "Josefstädter Straße/Albertgasse 2/3",
|
||||||
"bezirk": 8,
|
"bezirk": 8,
|
||||||
"type": "transFlag",
|
"type": "transFlag",
|
||||||
|
@ -859,7 +859,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 25,
|
"id": 2982464201,
|
||||||
"name": "Josefstädter Straße/Albertgasse 3/3",
|
"name": "Josefstädter Straße/Albertgasse 3/3",
|
||||||
"bezirk": 8,
|
"bezirk": 8,
|
||||||
"type": "transFlag",
|
"type": "transFlag",
|
||||||
|
@ -899,7 +899,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 26,
|
"id": 1928064980,
|
||||||
"name": "Äußere Mariahilfer Straße",
|
"name": "Äußere Mariahilfer Straße",
|
||||||
"bezirk": 15,
|
"bezirk": 15,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -935,7 +935,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 27,
|
"id": 3129325299,
|
||||||
"name": "Mariahilfer Straße/Neubaugasse",
|
"name": "Mariahilfer Straße/Neubaugasse",
|
||||||
"bezirk": 6,
|
"bezirk": 6,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -975,7 +975,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 28,
|
"id": 4181297250,
|
||||||
"name": "Thaliastraße/Brunnenstraße 1/3",
|
"name": "Thaliastraße/Brunnenstraße 1/3",
|
||||||
"bezirk": 16,
|
"bezirk": 16,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1013,7 +1013,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 29,
|
"id": 3599201578,
|
||||||
"name": "Thaliastraße/Brunnenstraße 2/3",
|
"name": "Thaliastraße/Brunnenstraße 2/3",
|
||||||
"bezirk": 16,
|
"bezirk": 16,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1048,7 +1048,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 30,
|
"id": 3997135747,
|
||||||
"name": "Thaliastraße/Brunnenstraße 3/3",
|
"name": "Thaliastraße/Brunnenstraße 3/3",
|
||||||
"bezirk": 16,
|
"bezirk": 16,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1085,7 +1085,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 31,
|
"id": 75101305,
|
||||||
"name": "Peter-Jordan-Straße/Dänenstraße 1/4",
|
"name": "Peter-Jordan-Straße/Dänenstraße 1/4",
|
||||||
"bezirk": 19,
|
"bezirk": 19,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1121,7 +1121,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 32,
|
"id": 376409592,
|
||||||
"name": "Peter-Jordan-Straße/Dänenstraße 2/4",
|
"name": "Peter-Jordan-Straße/Dänenstraße 2/4",
|
||||||
"bezirk": 19,
|
"bezirk": 19,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1152,7 +1152,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 33,
|
"id": 2946118523,
|
||||||
"name": "Peter-Jordan-Straße/Dänenstraße 3/4",
|
"name": "Peter-Jordan-Straße/Dänenstraße 3/4",
|
||||||
"bezirk": 19,
|
"bezirk": 19,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1183,7 +1183,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 34,
|
"id": 2260634750,
|
||||||
"name": "Peter-Jordan-Straße/Dänenstraße 4/4",
|
"name": "Peter-Jordan-Straße/Dänenstraße 4/4",
|
||||||
"bezirk": 19,
|
"bezirk": 19,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1214,7 +1214,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 35,
|
"id": 388184700,
|
||||||
"name": "Billrothstraße/Gymnasiumstraße",
|
"name": "Billrothstraße/Gymnasiumstraße",
|
||||||
"bezirk": 19,
|
"bezirk": 19,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1244,7 +1244,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 36,
|
"id": 2484638731,
|
||||||
"name": "Rauscherstraße/Wallensteinstraße",
|
"name": "Rauscherstraße/Wallensteinstraße",
|
||||||
"bezirk": 20,
|
"bezirk": 20,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1281,7 +1281,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 37,
|
"id": 1587033531,
|
||||||
"name": "Winarskystraße/Dresdner Straße",
|
"name": "Winarskystraße/Dresdner Straße",
|
||||||
"bezirk": 20,
|
"bezirk": 20,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
@ -1311,7 +1311,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": 38,
|
"id": 1222134532,
|
||||||
"name": "Pilgramgasse/Margaretenstraße",
|
"name": "Pilgramgasse/Margaretenstraße",
|
||||||
"bezirk": 5,
|
"bezirk": 5,
|
||||||
"type": "prideFlag",
|
"type": "prideFlag",
|
||||||
|
|
|
@ -35,7 +35,7 @@ export function viewFromArea(area: Area): View {
|
||||||
return new View({
|
return new View({
|
||||||
center: fromLonLat(area.center),
|
center: fromLonLat(area.center),
|
||||||
zoom: area.zoom,
|
zoom: area.zoom,
|
||||||
extent: transformExtent(area.extent, 'EPSG:4326', 'EPSG:3857'),
|
// extent: transformExtent(area.extent, 'EPSG:4326', 'EPSG:3857'),
|
||||||
constrainOnlyCenter: true
|
constrainOnlyCenter: true
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,56 +0,0 @@
|
||||||
import {Control} from "ol/control"
|
|
||||||
import {Options} from "ol/control/Control"
|
|
||||||
import Navigo from "navigo";
|
|
||||||
import {router} from "./map";
|
|
||||||
|
|
||||||
interface CustomOptions extends Options {
|
|
||||||
router: Navigo
|
|
||||||
}
|
|
||||||
|
|
||||||
export class AreaControl extends Control {
|
|
||||||
private textbox: HTMLDivElement
|
|
||||||
|
|
||||||
constructor(opt_options: CustomOptions) {
|
|
||||||
const options = opt_options || {}
|
|
||||||
|
|
||||||
const button = document.createElement('button')
|
|
||||||
button.innerText = 'c'
|
|
||||||
|
|
||||||
const element = document.createElement('div')
|
|
||||||
element.id = "city-selector"
|
|
||||||
element.className = 'ol-unselectable ol-control'
|
|
||||||
element.appendChild(button)
|
|
||||||
|
|
||||||
const textbox = document.createElement('div')
|
|
||||||
|
|
||||||
textbox.classList.add("textbox")
|
|
||||||
textbox.classList.add("ol-control")
|
|
||||||
|
|
||||||
const test = ["Wien", "Oberösterreich"]
|
|
||||||
test.forEach(n => {
|
|
||||||
const a = document.createElement('a')
|
|
||||||
a.href = "/" + encodeURIComponent(n)
|
|
||||||
a.innerText = n
|
|
||||||
a.dataset.navigo = ""
|
|
||||||
textbox.appendChild(a)
|
|
||||||
})
|
|
||||||
// textbox.style.display = "none"
|
|
||||||
element.appendChild(textbox)
|
|
||||||
router.updatePageLinks()
|
|
||||||
|
|
||||||
super({
|
|
||||||
element: element,
|
|
||||||
target: options.target,
|
|
||||||
});
|
|
||||||
this.textbox = textbox
|
|
||||||
button.addEventListener('click', this.handleClick.bind(this), false)
|
|
||||||
}
|
|
||||||
|
|
||||||
handleClick() {
|
|
||||||
if (this.textbox.style.display === "block") {
|
|
||||||
this.textbox.style.display = "none"
|
|
||||||
} else {
|
|
||||||
this.textbox.style.display = "block"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -5,10 +5,14 @@ import {Feature} from "ol";
|
||||||
import {LineString, Point} from "ol/geom";
|
import {LineString, Point} from "ol/geom";
|
||||||
import {averageCoords} from "../utils/geo";
|
import {averageCoords} from "../utils/geo";
|
||||||
|
|
||||||
export type MetaData = { [id: number]: Crossing }
|
export type FeatureType = "line" | "dot"
|
||||||
|
|
||||||
export function loadData(data: Crossing[], vectorSource: VectorSource): MetaData {
|
export interface FeatureProperties {
|
||||||
const metaData: MetaData = {}
|
crossing: Crossing
|
||||||
|
type: FeatureType
|
||||||
|
}
|
||||||
|
|
||||||
|
export function loadData(data: Crossing[], vectorSource: VectorSource): void {
|
||||||
console.info(data)
|
console.info(data)
|
||||||
data.sort((a, b) => {
|
data.sort((a, b) => {
|
||||||
/*
|
/*
|
||||||
|
@ -35,12 +39,12 @@ export function loadData(data: Crossing[], vectorSource: VectorSource): MetaData
|
||||||
const featureDot = new Feature({
|
const featureDot = new Feature({
|
||||||
geometry: new Point(averageCoords(points))
|
geometry: new Point(averageCoords(points))
|
||||||
});
|
});
|
||||||
|
|
||||||
|
featureLine.setProperties({"crossing": c, "type": "line"} as FeatureProperties)
|
||||||
|
featureDot.setProperties({"crossing": c, "type": "dot"} as FeatureProperties)
|
||||||
featureLine.setId(c.id)
|
featureLine.setId(c.id)
|
||||||
featureDot.setId(c.id + 10000)
|
featureDot.setId(c.id + 10000)
|
||||||
metaData[c.id] = c
|
|
||||||
vectorSource.addFeature(featureLine);
|
vectorSource.addFeature(featureLine);
|
||||||
vectorSource.addFeature(featureDot);
|
vectorSource.addFeature(featureDot);
|
||||||
})
|
})
|
||||||
return metaData
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
23
src/loadData.ts
Normal file
23
src/loadData.ts
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
import {Crossing} from "../interfaces";
|
||||||
|
import {loadData} from "./features";
|
||||||
|
import VectorSource from "ol/source/Vector";
|
||||||
|
|
||||||
|
export function loadAllData(vectorSource: VectorSource): void {
|
||||||
|
// @ts-ignore
|
||||||
|
import("../data/Wien.json?inline").then((data) => {
|
||||||
|
loadData(data.default as unknown as Crossing[], vectorSource)
|
||||||
|
})
|
||||||
|
|
||||||
|
// import("../data/Wien.json?url").then(importdata => {
|
||||||
|
// vectorSource.setAttributions(buildAttribution(importdata.default))
|
||||||
|
// })
|
||||||
|
|
||||||
|
// @ts-ignore
|
||||||
|
import("../data/Oberösterreich.json?inline").then((data) => {
|
||||||
|
loadData(data.default as unknown as Crossing[], vectorSource)
|
||||||
|
})
|
||||||
|
// import("../data/Oberösterreich.json?url").then(importdata => {
|
||||||
|
// vectorSource.setAttributions(buildAttribution(importdata.default))
|
||||||
|
// })
|
||||||
|
|
||||||
|
}
|
63
src/map.ts
63
src/map.ts
|
@ -9,17 +9,15 @@ import {Line, Vector2d} from "./vectorUtils";
|
||||||
import {drawZebraCrossing, zebraPatterns} from "./zebraUtils";
|
import {drawZebraCrossing, zebraPatterns} from "./zebraUtils";
|
||||||
import prideFlag from "../assets/prideflag.svg"
|
import prideFlag from "../assets/prideflag.svg"
|
||||||
import transFlag from "../assets/transflag.svg"
|
import transFlag from "../assets/transflag.svg"
|
||||||
import {loadData, MetaData} from "./features";
|
import {FeatureProperties} from "./features";
|
||||||
import Navigo from "navigo";
|
import {areas, viewFromArea, Wien} from "./areaData";
|
||||||
import {redirect} from "./router";
|
|
||||||
import {areas, buildAttribution, viewFromArea, Wien} from "./areaData";
|
|
||||||
import {Crossing} from "../interfaces";
|
import {Crossing} from "../interfaces";
|
||||||
import {defaults as defaultControls} from 'ol/control';
|
import {loadAllData} from "./loadData";
|
||||||
import {AreaControl} from "./controls";
|
import "./router"
|
||||||
|
import {router} from "./router";
|
||||||
|
|
||||||
export const router = new Navigo("/")
|
|
||||||
const map = new Map({
|
const map = new Map({
|
||||||
controls: defaultControls().extend([new AreaControl({router: router})]),
|
// controls: defaultControls().extend([new AreaControl({router: router})]),
|
||||||
target: 'map',
|
target: 'map',
|
||||||
layers: [
|
layers: [
|
||||||
new TileLayer({
|
new TileLayer({
|
||||||
|
@ -29,33 +27,9 @@ const map = new Map({
|
||||||
view: viewFromArea(Wien)
|
view: viewFromArea(Wien)
|
||||||
});
|
});
|
||||||
const vectorSource = new VectorSource();
|
const vectorSource = new VectorSource();
|
||||||
let metaData: MetaData
|
|
||||||
router.on("/Wien", () => {
|
|
||||||
map.setView(viewFromArea(Wien))
|
|
||||||
// @ts-ignore
|
|
||||||
import("../data/Wien.json?inline").then((data) => {
|
|
||||||
metaData = loadData(data.default as unknown as Crossing[], vectorSource)
|
|
||||||
})
|
|
||||||
|
|
||||||
import("../data/Wien.json?url").then(importdata => {
|
loadAllData(vectorSource)
|
||||||
vectorSource.setAttributions(buildAttribution(importdata.default))
|
|
||||||
})
|
|
||||||
|
|
||||||
})
|
|
||||||
router.on("/Ober%C3%B6sterreich", () => {
|
|
||||||
map.setView(viewFromArea(areas.OOE))
|
|
||||||
|
|
||||||
// @ts-ignore
|
|
||||||
import("../data/Oberösterreich.json?inline").then((data) => {
|
|
||||||
metaData = loadData(data.default as unknown as Crossing[], vectorSource)
|
|
||||||
})
|
|
||||||
import("../data/Oberösterreich.json?url").then(importdata => {
|
|
||||||
vectorSource.setAttributions(buildAttribution(importdata.default))
|
|
||||||
})
|
|
||||||
|
|
||||||
})
|
|
||||||
redirect(router, "/", "/Wien")
|
|
||||||
router.resolve()
|
|
||||||
const greenLine = new Style({
|
const greenLine = new Style({
|
||||||
fill: new Fill({color: '#00FF00'}),
|
fill: new Fill({color: '#00FF00'}),
|
||||||
stroke: new Stroke({color: '#00FF00', width: 2})
|
stroke: new Stroke({color: '#00FF00', width: 2})
|
||||||
|
@ -67,11 +41,11 @@ function renderer(coordinates: Coordinate | Coordinate[] | Coordinate[][], state
|
||||||
const line = new Line(start, end)
|
const line = new Line(start, end)
|
||||||
// console.log(line.vec.length())
|
// console.log(line.vec.length())
|
||||||
const ctx = state.context;
|
const ctx = state.context;
|
||||||
const featureID = Number(state.feature.getId())
|
const featureProperties = state.feature.getProperties() as FeatureProperties
|
||||||
if (!featureID || featureID > 10000) {
|
if (featureProperties.type != "line") {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const crossing = metaData[featureID]
|
const crossing: Crossing = featureProperties.crossing
|
||||||
let numStripes = crossing.geo!.length / 0.5
|
let numStripes = crossing.geo!.length / 0.5
|
||||||
if (state.resolution > 0.3) {
|
if (state.resolution > 0.3) {
|
||||||
numStripes /= 2
|
numStripes /= 2
|
||||||
|
@ -114,12 +88,13 @@ const vectorLineLayer = new VectorLayer({
|
||||||
if (zoom > 17) {
|
if (zoom > 17) {
|
||||||
return crossingsStyle
|
return crossingsStyle
|
||||||
}
|
}
|
||||||
const featureID = Number(feature.getId()) - 10000
|
const featureProperties = feature.getProperties() as FeatureProperties
|
||||||
if (!featureID || featureID < 0) {
|
const crossing = featureProperties.crossing
|
||||||
|
if (featureProperties.type != "dot") {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const crossing = metaData[featureID]
|
|
||||||
if (typeof crossing==="undefined") {
|
if (typeof crossing === "undefined") {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
switch (crossing.type) {
|
switch (crossing.type) {
|
||||||
|
@ -132,6 +107,12 @@ const vectorLineLayer = new VectorLayer({
|
||||||
});
|
});
|
||||||
map.addLayer(vectorLineLayer);
|
map.addLayer(vectorLineLayer);
|
||||||
|
|
||||||
|
Object.entries(areas).forEach(([name, area]) => {
|
||||||
|
router.on("/" + encodeURIComponent(area.name), () => {
|
||||||
|
map.setView(viewFromArea(area))
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
// window.bla = function () {
|
// window.bla = function () {
|
||||||
// const view = map.getView()
|
// const view = map.getView()
|
||||||
|
@ -146,5 +127,5 @@ map.addLayer(vectorLineLayer);
|
||||||
// }
|
// }
|
||||||
|
|
||||||
import("./popups").then(popups => {
|
import("./popups").then(popups => {
|
||||||
popups.initPopups(map, metaData);
|
popups.initPopups(map, vectorSource);
|
||||||
})
|
})
|
||||||
|
|
|
@ -1,41 +1,61 @@
|
||||||
import {Overlay} from "ol";
|
import {Feature, Overlay} from "ol";
|
||||||
import {createDateWithDisclaimer, displaySources} from "./text";
|
import {createDateWithDisclaimer, displaySources} from "./text";
|
||||||
import type Map from "ol/Map";
|
import type Map from "ol/Map";
|
||||||
import {Crossing} from "../interfaces";
|
import {Crossing} from "../interfaces";
|
||||||
import {createElement} from "./domutils";
|
import {createElement} from "./domutils";
|
||||||
import "hint.css/hint.base.css"
|
import "hint.css/hint.base.css"
|
||||||
|
import {router} from "./router";
|
||||||
|
import VectorSource from "ol/source/Vector";
|
||||||
|
import {FeatureProperties} from "./features";
|
||||||
|
import {Point} from "ol/geom";
|
||||||
|
|
||||||
export function initPopups(map: Map, metaData: { [id: number]: Crossing }) {
|
const container = document.getElementById('popup')!;
|
||||||
const container = document.getElementById('popup')!;
|
const content = document.getElementById('popup-content')!;
|
||||||
const content = document.getElementById('popup-content')!;
|
const closer = document.getElementById('popup-closer')!;
|
||||||
const closer = document.getElementById('popup-closer')!;
|
const overlay = new Overlay({
|
||||||
|
|
||||||
const overlay = new Overlay({
|
|
||||||
element: container,
|
element: container,
|
||||||
autoPan: {
|
autoPan: {
|
||||||
animation:{
|
animation: {
|
||||||
duration:250,
|
duration: 250,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
export function initPopups(map: Map, vectorSource: VectorSource) {
|
||||||
|
|
||||||
map.addOverlay(overlay);
|
map.addOverlay(overlay);
|
||||||
|
|
||||||
closer.onclick = function () {
|
closer.onclick = function () {
|
||||||
overlay.setPosition(undefined);
|
router.navigate("/")
|
||||||
closer.blur();
|
|
||||||
return false;
|
return false;
|
||||||
};
|
};
|
||||||
map.on('singleclick', event => {
|
map.on('singleclick', event => {
|
||||||
map.forEachFeatureAtPixel(event.pixel, feature => {
|
map.forEachFeatureAtPixel(event.pixel, feature => {
|
||||||
const coordinate = event.coordinate;
|
const coordinate = event.coordinate;
|
||||||
let id = Number(feature.getId())
|
const crossing: Crossing = feature.getProperties().crossing
|
||||||
|
router.navigate("/flag/" + feature.getId())
|
||||||
|
}, {hitTolerance: 5})
|
||||||
|
if (!map.hasFeatureAtPixel(event.pixel, {hitTolerance: 5})) {
|
||||||
|
router.navigate("/")
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
router.on("/flag/:id", (match) => {
|
||||||
|
const id = match?.data?.id
|
||||||
if (!id) {
|
if (!id) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (id > 10000) {
|
console.log("routing")
|
||||||
id -= 10000
|
console.info(id)
|
||||||
|
|
||||||
|
const feature = vectorSource.getFeatureById(id) as Feature<Point>
|
||||||
|
if (!feature) {
|
||||||
|
return
|
||||||
}
|
}
|
||||||
const crossing = metaData[id]
|
console.log(feature.getProperties())
|
||||||
|
|
||||||
|
const featureProperties = feature.getProperties() as FeatureProperties
|
||||||
|
const crossing = featureProperties.crossing
|
||||||
|
|
||||||
content.innerHTML = "";
|
content.innerHTML = "";
|
||||||
const p = createElement("p")
|
const p = createElement("p")
|
||||||
|
@ -56,12 +76,13 @@ export function initPopups(map: Map, metaData: { [id: number]: Crossing }) {
|
||||||
const sourcesBlock = displaySources(crossing.sources)
|
const sourcesBlock = displaySources(crossing.sources)
|
||||||
content.appendChild(createElement("hr"))
|
content.appendChild(createElement("hr"))
|
||||||
content.appendChild(sourcesBlock)
|
content.appendChild(sourcesBlock)
|
||||||
overlay.setPosition(coordinate);
|
overlay.setPosition(feature.getGeometry()?.getCoordinates());
|
||||||
|
|
||||||
}, {hitTolerance: 5})
|
})
|
||||||
if (!map.hasFeatureAtPixel(event.pixel, {hitTolerance: 5})) {
|
router.on("/", () => {
|
||||||
overlay.setPosition(undefined);
|
overlay.setPosition(undefined);
|
||||||
closer.blur();
|
closer.blur();
|
||||||
}
|
})
|
||||||
});
|
router.resolve()
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,19 @@
|
||||||
import Navigo, {Route} from "navigo";
|
import Navigo, {Route} from "navigo";
|
||||||
|
import {areas, viewFromArea, Wien} from "./areaData";
|
||||||
|
export const router = new Navigo("/")
|
||||||
|
|
||||||
|
// router.on("/Wien", () => {
|
||||||
|
// map.setView(viewFromArea(Wien))
|
||||||
|
//
|
||||||
|
// })
|
||||||
|
// router.on("/Ober%C3%B6sterreich", () => {
|
||||||
|
// map.setView(viewFromArea(areas.OOE))
|
||||||
|
//
|
||||||
|
//
|
||||||
|
// })
|
||||||
|
|
||||||
|
// redirect(router, "/", "/Wien")
|
||||||
|
|
||||||
|
|
||||||
export function redirect(router:Navigo,from:string,to:string){
|
export function redirect(router:Navigo,from:string,to:string){
|
||||||
router.on(from, () => {
|
router.on(from, () => {
|
||||||
|
|
|
@ -5,7 +5,6 @@ export default defineConfig({
|
||||||
// splitVendorChunkPlugin(),
|
// splitVendorChunkPlugin(),
|
||||||
// visualizer(),
|
// visualizer(),
|
||||||
],
|
],
|
||||||
base: "",
|
|
||||||
build: {
|
build: {
|
||||||
sourcemap: true,
|
sourcemap: true,
|
||||||
rollupOptions: {
|
rollupOptions: {
|
||||||
|
|
Loading…
Reference in a new issue