GPS Daten in Blog einbinden

[demlak]

Moin,

für einen geplanten Blog (kirby CMS) bin ich noch auf der Suche nach einer netten Einbindung meiner Touren.

Genial wäre, wenn ich das Einbinden meiner Touren genauso selber hosten könnte, wie den rest des Blogs (das Gerüst fürs Blog steht schon). Aber auch ein Rückgriff auf z.B. Strava wäre eine Option.

Kennt ihr da etwas, was nett aussieht, nicht nur ein Bild von einer Landkarte ist und dennoch ressourcenschonend sein könnte?

Wie macht ihr das?

besten dank im voraus

 

[knogi]

Bist du auf der Suche nach einem Plugin oder darfs auch (minimales) selber scripten sein? Bei letzterem kannst dir mal leaflet und leaflet-gpx anschauen.

 

[demlak]

wenns nicht komplett selbst coden ist und nur ein bisschen anpassen ist, dann darfs auch etwas arbeit sein..
Am Ende muss aber was dabei herauskommen, wo ich nur minimale Arbeit habe, wenn ich einen neuen Track veröffentliche.
Das ganze darf auch gerne etwas "fancy" aufbereitet sein =)

leafleat hab ich mir gerade mal angeschaut.. ist eine basis. find es allerdings nicht sooo schick..
http://mpetazzoni.github.io/leaflet-gpx/

ich hab mich mit dem Thema bisher noch nicht wirklich beschäftigt und weiß daher auch noch nicht so genau, was ich so an features haben will.. ich denke, dass wird sich hier im Thread erst im Laufe der Diskussion herauskristallisieren.

Nett wäre ein Höhenprofil mit Geschwindigkeitsangaben. Eine 3D Darstellung mit Animation wird vermutlich viele Ressourcen fressen und schließt vermutlich auch selfhosting aus (weil es so was vermutlich nicht frei zugänglich gibt)

 

[demlak]

das hier sieht interessant aus:

http://www.bernhard-gaul.de/gpxviewer/gpxviewer.php

zum selber hosten:
https://www.j-berkemeier.de/GPXViewer/

 

[knogi]

Für ein Höhenprofil gäbe es für leaflet ein Plugin: http://mrmufflon.github.io/Leaflet.Elevation/ Hab ich aber selber noch nicht ausprobiert. Was findest du an leaflet nicht so schick? Die Karte die genutzt wird kann man austauschen, bzw. mehrere einbinden.

3D Darstellung kenn ich jetzt für Webseiten nicht. Ich könnte mir vorstellen, dass hier das Bildmaterial der schwierige Teil ist. Müsste ja sowas wie Google Earth als Ausgangslage haben.

 

[demlak]

node.js kommt mir nicht auf meinen server..

vermutlich hab ich mich mit leaflet auch noch nicht genug im detail beschäftigt.. das scheint ja sehr modular zu sein..

 

[demlak]

ok.. leaflet scheint wirklich krass zu sein.. ich muss mir das nochmal genauer anschauen..

Aktuell bin ich schon mal soweit, mit der Strava api per php zu kommunizieren.. und ich hab ein bash script, dass mir die gpx files von strava runter-laden kann.. (der stream über die api ist nicht detailliert genug)
Randbemerkung: ja, es gibt von Strava auch Widgets, die man einbinden kann. diese will ich aber aus mehreren gründen nicht nutzen. (z.B. Tracking meiner Websitebesucher durch Strava, doofes Design, etc.)

bei der ganzen Recherche bin ich auf eine menge Services gestoßen, die sich rund um GPS im web gebildet haben..

Für mich als Dokumentation und für andere, die sich ebenfalls mit dem Thema beschäftigen wollen, hier ein paar links:

• http://leafletjs.com/
• python script zum konvertieren von gpx files in svg vector grafiken
• perl script zum generieren von png dateien aus einer gpx datei
• png dateien über andere bilder legen
• Showing GPS tracks in 3D with three.js and d3.js
• Gpx Visualization
• https://geophp.net/
• GPX Viewer - Einbinden von maps in webseiten
• trackviewer tutorial
• Synchronized HTML5 Video with GPS Data
• http://www.gpsvisualizer.com/

Services falls jemand nicht selber basteln will:

• https://marcbaldwin.github.io/velographic/
• https://www.strava.com/apps/visualizer
• https://veloviewer.com/
• http://www.jonathanokeeffe.com/strava/map.php
• http://relive.cc

und sowas findet man, wenn man nach 3d Visualisierung sucht =) https://www.nicetrails.com/


####

edit 18.12.2022.. weitere Links zum Thema Geohash:

• http://geohash.co/
• https://github.com/ImproveOSM/geohash-plugin
• https://github.com/higuri/geohash-map
• https://higuri.github.io/geohash-map/index.html
• https://wiki.openstreetmap.org/wiki/Geohash
• http://geohash.org/u1qcyw57z
• http://geohash.org/site/tips.html