Add code and style for basic map display

This commit is contained in:
don philipe
2024-03-31 20:25:18 +02:00
parent bb8b0bd4ad
commit 0e378867c1
19 changed files with 9024 additions and 0 deletions

35
README.md Normal file
View File

@@ -0,0 +1,35 @@
# How it works/features
- vector tileserver (martin) delivers tiles
- martin needs postgis
- needs a job which fills database with OSM data
- layers need to be defined
- style for tiles (via maputnk)
- maplibre framework brings tiles and style together and draws on website
- map shows various outdoor relevant features (clickable)
- routing requests will be forwarded to (local) graphhopper
- graphhopper needs osm pbf file
- responses from graphhopper will be drawn on map via maplibre
## Structure
- maputnik to edit map style(s)
- postgresql database to hold osm data
- regular imports via osm2pgsql tool from pbf download
- vector tileserver (marting) to deliver vector tiles with data from db
- graphhopper with api to deliver routing data
- regular imports from pbf download
- pilgrim to glue tiles and routing together
- asks tileserver via maplibre-gl-js (https://github.com/maplibre/maplibre-gl-js/) for tiles (map.pilgrim.home.spacedon.de)
- asks graphhopper api via api client (https://github.com/graphhopper/directions-api-js-client) for routing (routing.pilgrim.home.spacedon.de)
# Glyphs
Roboto font (Apache Licence)
1. Get fonts from https://github.com/openmaptiles/fonts
2. package fonts to PBF with `npm install` followed by `node ./generate.js`
3. copy Roboto glyphs from `_output` directory to desired place where it can be accessed from map lib
Alternative repo https://github.com/orangemug/font-glyphs/

1849
mapstyles/spacedon.json Normal file

File diff suppressed because it is too large Load Diff

81
pom.xml Normal file
View File

@@ -0,0 +1,81 @@
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>de.spacedon</groupId>
<artifactId>pilgrim</artifactId>
<version>1.0-SNAPSHOT</version>
<!--<packaging>war</packaging>-->
<name>Pilgrim</name>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<maven.compiler.source>11</maven.compiler.source>
<maven.compiler.target>11</maven.compiler.target>
</properties>
<dependencies>
<dependency>
<groupId>org.eclipse.jetty</groupId>
<artifactId>jetty-server</artifactId>
<version>11.0.3</version>
</dependency>
<dependency>
<groupId>org.eclipse.jetty</groupId>
<artifactId>jetty-servlet</artifactId>
<version>11.0.3</version>
</dependency>
<dependency>
<groupId>org.eclipse.jetty</groupId>
<artifactId>apache-jsp</artifactId>
<version>11.0.3</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<artifactId>maven-assembly-plugin</artifactId>
<executions>
<execution>
<phase>package</phase>
<goals>
<goal>single</goal>
</goals>
</execution>
</executions>
<configuration>
<archive>
<manifest>
<addClasspath>true</addClasspath>
<mainClass>de.spacedon.PilgrimServer</mainClass>
</manifest>
</archive>
<descriptorRefs>
<descriptorRef>jar-with-dependencies</descriptorRef>
</descriptorRefs>
</configuration>
</plugin>
<!---<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.1</version>
<configuration>
<source>1.8</source>
<target>1.8</target>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<version>2.6</version>
<configuration>
<failOnMissingWebXml>false</failOnMissingWebXml>
<includeEmptyDirectories>true</includeEmptyDirectories>
</configuration>
</plugin>-->
</plugins>
</build>
</project>

38
sprites/arrow-right.svg Normal file
View File

@@ -0,0 +1,38 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="87.468567mm"
height="51.023762mm"
viewBox="0 0 87.468567 51.023762"
version="1.1"
id="svg1"
sodipodi:docname="arrow-right.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
id="layer1"
inkscape:export-filename="layer1.svg"
inkscape:export-xdpi="768"
inkscape:export-ydpi="768"
transform="translate(-35.378201,-76.296118)">
<path
id="rect1"
style="fill:#000000;stroke-width:1.32292"
d="M 78.678918,76.296118 78.66755,90.9283 H 35.378202 v 21.7594 h 43.272811 l -0.01137,14.63218 44.207127,-25.47752 z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

62
sprites/bench.svg Normal file
View File

@@ -0,0 +1,62 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="50mm"
height="14.785411mm"
viewBox="0 0 50 14.785411"
version="1.1"
id="svg1"
inkscape:export-filename="bench.svg"
inkscape:export-xdpi="768"
inkscape:export-ydpi="768"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-25.000001,-77.500005)">
<g
id="g2">
<rect
style="fill:#000000;stroke-width:0.932147"
id="rect1"
width="50"
height="5"
x="25"
y="77.5"
inkscape:export-filename="bench.svg"
inkscape:export-xdpi="768"
inkscape:export-ydpi="768" />
<rect
style="fill:#000000;stroke-width:0.870981"
id="rect2"
width="7"
height="10"
x="31.5"
y="82.280975" />
<rect
style="fill:#000000;stroke-width:0.870981"
id="rect2-5"
width="7"
height="10"
x="61.5"
y="82.285416" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

30
sprites/cliff.svg Normal file
View File

@@ -0,0 +1,30 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="64mm"
height="39.937515mm"
viewBox="0 0 64 39.937515"
version="1.1"
id="svg5"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs2" />
<g
id="layer1"
transform="translate(-63.500574,-93.395612)">
<rect
style="fill:#6d6d6d;fill-opacity:1;stroke-width:1.68969"
id="rect234"
width="64"
height="8"
x="63.500572"
y="125.33312" />
<path
style="fill:#6d6d6d;fill-opacity:1;stroke-width:1.32292"
id="path398"
d="M 108.40738,70.173901 61.652371,70.174102 85.029699,29.68298 Z"
transform="matrix(0.68441871,0,0,0.79029668,37.304536,69.937257)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 833 B

60
sprites/first-aid.svg Normal file
View File

@@ -0,0 +1,60 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="50mm"
height="50.000004mm"
viewBox="0 0 50 50.000004"
version="1.1"
id="svg1"
inkscape:export-filename="bench.svg"
inkscape:export-xdpi="768"
inkscape:export-ydpi="768"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-70.000002,-89.999997)">
<g
id="g3">
<rect
style="fill:#005108;fill-opacity:1;stroke-width:1.38893"
id="rect2"
width="50"
height="50"
x="70"
y="90" />
<rect
style="fill:#ffffff;stroke-width:1.53814"
id="rect3"
width="15"
height="40"
x="87.5"
y="95" />
<rect
style="fill:#ffffff;stroke-width:1.53814"
id="rect3-2"
width="15"
height="40"
x="107.5"
y="-115"
transform="rotate(90)" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

60
sprites/hospital.svg Normal file
View File

@@ -0,0 +1,60 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="50mm"
height="50.000004mm"
viewBox="0 0 50 50.000004"
version="1.1"
id="svg1"
inkscape:export-filename="bench.svg"
inkscape:export-xdpi="768"
inkscape:export-ydpi="768"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm" />
<defs
id="defs1" />
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-70.000002,-89.999997)">
<g
id="g3">
<rect
style="fill:#ffffff;fill-opacity:1;stroke-width:1.38893"
id="rect2"
width="50"
height="50"
x="70"
y="90" />
<rect
style="fill:#ff0000;stroke-width:1.53814"
id="rect3"
width="15"
height="40"
x="87.5"
y="95" />
<rect
style="fill:#ff0000;stroke-width:1.53814"
id="rect3-2"
width="15"
height="40"
x="107.5"
y="-115"
transform="rotate(90)" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

44
sprites/leaf_tree.svg Normal file
View File

@@ -0,0 +1,44 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="65.121857mm"
height="44.999847mm"
viewBox="0 0 65.121857 44.999847"
version="1.1"
id="svg5"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview7"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false" />
<defs
id="defs2" />
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-107.4198,-157.75109)">
<path
id="path280"
style="fill:#000000;stroke-width:1.42666"
d="m 132.41982,157.75109 a 24.999975,29.99997 0 0 0 -25.00002,29.99972 24.999975,29.99997 0 0 0 3.36414,15.00012 h 2.9409 a 22.499978,26.999973 0 0 1 -3.80493,-15.00012 22.499978,26.999973 0 0 1 22.49991,-26.9999 22.499978,26.999973 0 0 1 22.49992,26.9999 22.499978,26.999973 0 0 1 -3.80493,15.00012 h 2.95589 a 24.999975,29.99997 0 0 0 3.34915,-15.00012 24.999975,29.99997 0 0 0 -25.00003,-29.99972 z" />
<rect
style="fill:#000000;fill-opacity:1;stroke-width:0.568493"
id="rect1078"
width="20"
height="2.5"
x="152.54166"
y="200.25093" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

4461
sprites/meadow.svg Normal file

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 122 KiB

23
sprites/peak.svg Normal file
View File

@@ -0,0 +1,23 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="70.71093mm"
height="35.355469mm"
viewBox="0 0 70.71093 35.355469"
version="1.1"
id="svg5"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs2" />
<g
id="layer1"
transform="translate(-73.00123,-130.02101)">
<path
id="rect1104"
style="fill:#a05a2c;fill-opacity:1;stroke-width:1.32292"
d="M 168.55849,15.318981 V 65.319159 L 218.55866,15.318981 Z"
transform="rotate(45)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 622 B

82
sprites/saddle.svg Normal file
View File

@@ -0,0 +1,82 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="56.28363mm"
height="78.296181mm"
viewBox="0 0 56.28363 78.296181"
version="1.1"
id="svg5"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview7"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false" />
<defs
id="defs2" />
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-43.022355,-83.937215)">
<rect
style="fill:#000000;stroke-width:1.22726"
id="rect234"
width="10"
height="50"
x="54.244503"
y="98.092239"
inkscape:export-filename="saddle.png"
inkscape:export-xdpi="768"
inkscape:export-ydpi="768" />
<rect
style="fill:#000000;stroke-width:1.22726"
id="rect234-3"
width="10"
height="50"
x="78.093346"
y="98.092239" />
<rect
style="fill:#000000;stroke-width:1.40507"
id="rect366"
width="10"
height="20"
x="124.58546"
y="-5.8544207"
transform="rotate(45)" />
<rect
style="fill:#000000;stroke-width:1.40507"
id="rect366-7"
width="10"
height="20"
x="23.905682"
y="-114.79947"
transform="rotate(135)" />
<rect
style="fill:#000000;stroke-width:1.40507"
id="rect366-7-5"
width="10"
height="20"
x="39.497555"
y="-179.9351"
transform="rotate(135)" />
<rect
style="fill:#000000;stroke-width:1.40507"
id="rect366-6"
width="10"
height="20"
x="140.13342"
y="59.290627"
transform="rotate(45)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

199
sprites/shelter.svg Normal file
View File

@@ -0,0 +1,199 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="85.931801mm"
height="93.009956mm"
viewBox="0 0 85.931801 93.009956"
version="1.1"
id="svg5"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview7"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false" />
<defs
id="defs2" />
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-57.003045,-78.273611)">
<rect
style="fill:#000000;stroke-width:1.46804"
id="rect234"
width="5"
height="50"
x="70.661674"
y="121.28358" />
<rect
style="fill:#000000;stroke-width:1.46804"
id="rect234-35"
width="5"
height="50"
x="134.39127"
y="-2.4153519"
transform="rotate(45)" />
<rect
style="fill:#000000;stroke-width:1.46804"
id="rect234-3"
width="5"
height="50"
x="117.85863"
y="121.28358" />
<rect
style="fill:#000000;stroke-width:1.46804"
id="rect234-3-6"
width="5"
height="50"
x="-2.5868704"
y="134.38905"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012"
width="10"
height="2"
x="-29.17605"
y="122.16943"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-2"
width="10"
height="2"
x="-8.8673124"
y="127.20268"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-9"
width="10"
height="2"
x="5.6827588"
y="143.3362"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-1"
width="10"
height="2"
x="4.672143"
y="154.02977"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-27"
width="10"
height="2"
x="8.3520527"
y="164.91597"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-0"
width="10"
height="2"
x="15.805543"
y="149.36444"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-93"
width="10"
height="2"
x="6.0315266"
y="129.20436"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-6"
width="10"
height="2"
x="-1.0452974"
y="119.65031"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-06"
width="10"
height="2"
x="-17.187216"
y="118.07086"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-26"
width="10"
height="2"
x="-22.669714"
y="129.67317"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-18"
width="10"
height="2"
x="19.431524"
y="159.17046"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-7"
width="10"
height="2"
x="4.2560196"
y="174.02873"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-92"
width="10"
height="2"
x="19.332239"
y="170.80815"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-02"
width="10"
height="2"
x="-41.460339"
y="127.03181"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-3"
width="10"
height="2"
x="-33.980171"
y="114.59465"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-75"
width="10"
height="2"
x="-13.478518"
y="110.2551"
transform="rotate(-45)" />
<rect
style="fill:#000000;stroke-width:0.392622"
id="rect1012-8"
width="10"
height="2"
x="15.156796"
y="137.25546"
transform="rotate(-45)" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.9 KiB

View File

@@ -0,0 +1,18 @@
package de.spacedon;
import java.io.IOException;
import jakarta.servlet.ServletException;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
public class MyServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("application/json");
response.setStatus(HttpServletResponse.SC_OK);
response.getWriter().println("{\"status\":\"ok\"}");
}
}

View File

@@ -0,0 +1,36 @@
package de.spacedon;
import java.io.File;
import org.eclipse.jetty.server.Connector;
import org.eclipse.jetty.server.Server;
import org.eclipse.jetty.server.ServerConnector;
import org.eclipse.jetty.servlet.DefaultServlet;
import org.eclipse.jetty.servlet.ServletContextHandler;
import org.eclipse.jetty.servlet.ServletHolder;
public class PilgrimServer {
/**
* Register Servlets and start Jetty server
*/
public static void main(String[] args) throws Exception {
Server server = new Server(8082);
ServletContextHandler contextHandler = new ServletContextHandler(ServletContextHandler.SESSIONS);
contextHandler.setContextPath("/");
server.setHandler(contextHandler);
// register custom Servlet at endpoint /index
contextHandler.addServlet(new ServletHolder(new MyServlet()), "/index");
// register index.html
ServletHolder staticHolder = new ServletHolder(new DefaultServlet());
staticHolder.setInitParameter("resourceBase", "src/main/webapp");
staticHolder.setInitParameter("pathInfoOnly", "true");
staticHolder.setInitParameter("dirAllowed", "false");
contextHandler.addServlet(staticHolder, "/*");
server.start();
server.join();
}
}

View File

@@ -0,0 +1,85 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Display a map</title>
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<script src="lib.js"></script>
<script src="https://unpkg.com/maplibre-gl@3.1.0/dist/maplibre-gl.js"></script>
<link href="https://unpkg.com/maplibre-gl@3.1.0/dist/maplibre-gl.css" rel="stylesheet">
<style>
body {
margin: 0;
padding: 0;
}
#map {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
#features {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 20%;
overflow: auto;
background: rgba(255, 255, 255, 0.8);
}
.maplibregl-popup {
max-width: 200px;
font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
}
</style>
</head>
<body>
<div id="map">
</div>
<pre id="features"></pre>
<script>
var map = new maplibregl.Map({ container: 'map', // container id
//style: 'https://demotiles.maplibre.org/style.json', // style URL
style: 'spacedon.json', // style URL
center: [13, 51], // starting position [lng, lat]
zoom: 6 // starting zoom
});
map.addControl(new maplibregl.NavigationControl());
map.on('mousemove', function (e) {
var features = map.queryRenderedFeatures(e.point);
// Limit the number of properties we're displaying for
// legibility and performance
var displayProperties = [ 'type', 'properties', 'id', 'layer', 'source', 'sourceLayer', 'state' ];
var displayFeatures = features.map(function (feat) {
var displayFeat = {};
displayProperties.forEach(function (prop) {
displayFeat[prop] = feat[prop];
});
return displayFeat;
});
document.getElementById('features').innerHTML = JSON.stringify( displayFeatures, null, 2 );
});
map.on('click', function (e) {
var coordinates = e.lngLat;
// Ensure that if the map is zoomed out such that multiple
// copies of the feature are visible, the popup appears
// over the copy being pointed to.
while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {
coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;
}
new maplibregl.Popup()
.setLngLat(coordinates)
.setHTML('<button>start</button></br><button>via</button></br><button>finish</button>')
.addTo(map);
});
const startMarker = new maplibregl.Marker({draggable: true})
.setLngLat([0, 0]);
const finishMarker = new maplibregl.Marker({draggable: true})
.setLngLat([0, 0]);
const viaMarkers = new Array();
</script>
</body>
</html>

7
src/main/webapp/lib.js Normal file
View File

@@ -0,0 +1,7 @@
let lib = new function () {
this.setStartMarker = function (coordinates) {
}
this.setMarker = function (marker, lng, lat, map) {
marker.setLngLat([lng, lat]).addTo(map);
};
};

File diff suppressed because it is too large Load Diff

5
start.sh Executable file
View File

@@ -0,0 +1,5 @@
#!/bin/sh
mvn clean package
java -jar target/pilgrim-1.0-SNAPSHOT-jar-with-dependencies.jar
exit 0