This question is not answered. Helpful answers available: 2. Correct answers available: 1.

Permlink Replies: 1 - Pages: 1 - Last Post: 1 Apr 23, 14:06 Last Post By: linuxrog Threads: [ Previous | Next ]

Posts: 1,247
Registered: 14-Dec-2007
Web-pages to make an OpenStreetMap for all skins.
Posted: 28 Oct 22, 12:27
  Click to reply to this thread Reply
With program MakeMap you can make an OpenStreetMap map with all pictures in an album which contains GPS locations for these skins: Turtle, Tiger, PhotoBlogger, Projector, Story, Slide Show 4, PhotoSwipe, FancyBox and LightGalklery, You can find examples here. Open the map by clicking on the button with the globe.

With the two attached files and the External Tool to create 'points.js' file to populate a leaflet map you can now make OpenStreetMap maps for all skins, see this example album made with the Minimal skin.

The procedure to make such a map is as follows:

  • Make file points.js with the tool. This file is saved in the output folder of the album.
  • Copy one of the attached files to the same directory. Use file OSM_Map_points_js_same_window.html if the map should be opened in the same window as the index file of the album or use file OSM_Map_points_js_new_window.html if the map should be displayed in a new window.
  • Add with the HTML-editor a link to this file in the album description as is done in the example album.
  • If you have also a GPS track for the album, you can convert that to a file track.js in the output directory with program ConvertTrack; this track will in that case be displayed in the same OpenStreetMap, see also this thread.

If one of the attched files is used, clicking on the thumbnail (width 300px) in an opened waypoint will not open the corresponding slide image; to get that implemented, you should use program MakeMap.

The width of the thumbnails displayed in the waypoints pop-up windows is 300 pixels. You can change that to a larger or smaller value by editing the web-page: search for the two '300' strings and change these in the value you like to use.
If you like to change the initial size of the map, search the string
 map.setView( points[0].l,15);
and make the zoom-value 15 larger to get a more detailed map or make the value smaller to get a map which covers a larger area.


It is also possible to make a map via the GPS Visualizer site. You can do that by opening a gpx-file on the GPS Visualizer site in the Get started now window with output format Leaflet Map and by next clicking on Map it.
The map is displayed in the next window, click the download link to save it as an html-file in the output folder of the album.
To add it to a FancyBox skin,, PhotoSwipe skin or LightGallery skin album open the Skin settings / Links tab and browse for the html-file in one of the URL fields.
If you use another album, search for custom code to add a button to open the html-file.

See this FancyBox album how the track is displayed.

You can also open in the same way a Google Earth map kml-file with the GPS track and the photo locations made by my program MakeMap and convert that to a leaflet map.

See this LigthGallery album how the track and photo locations are displayed.

Edited by: AndreWolff on 1 Apr 2023, 14:01

Posts: 199
Registered: 21-Nov-2008
Re: Web-pages to make an OpenStreetMap for all skins.
Posted: 29 Nov 22, 01:44   in response to: AndreWolff in response to: AndreWolff
  Click to reply to this thread Reply
Thanks. I'll take a look.
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums