Simple map functionality with capabilities of showing markers and lines.
The map is created from parameters defined in the URL. The simplest map only needs parameters for latitude and longitude coordinates defining the origo and a zoom level, everything else is optional.
Valid parameter values
- Latitude and longitude values are measured in degrees.
- Latitude values can be in the interval -90 to 90.
- Longitude values can be in the interval -180 to 180.
- Zoom level values can be in the interval 0 to 18.
Values must be properly URL encoded. At the moment
titleis probably the only parameter that may need an encoded value (since all the other values are numbers or booleans).
The map is initially centered at coordinates defined by the
The map has an initial
A title can be defined.
- point0, point1, ..., point9
pointNis an array of coordinates for which a polyline should be drawn between each consecutive point (order is therefore important). A polyline can be shown between (at least two) coordinates defined with the
pointNparameter. Each point is defined by latitude and longitude coordinates.
You can draw up to ten distinct polylines. Use a different suffix number, 0-9, for each of them.
point0=6,1&point0=6,2&point0=7,1&point1=8,5&point1=7,7&point1=8,9&point1=7,3will draw two distinct polylines.
markeris an array of coordinates where a marker should be placed. Markers can be shown for (one of several) defined points.
A marker can be shown for origo (
If you click in the map, the current coordinates will popup (
Show the smallest possible circle, centered at origo, that "surrounds" every marker defined (
Show the smallest possible rectangle that "surrounds" every marker defined (
Uses polygons instead of polylines when connecting points (
usePolygon=true). This means that the last and first points in every list of points are connected with an implicit line.
A link to a similar view in Google Maps is also shown.
- NNM logo all over the world
- The four outermost points in Sweden and the centre (defining both markers and polygon by hand)
- The four outermost points in Sweden and the centre (defining only markers and let the program calculate the rest)
- The Märket island, with its fascinating country (and time zone) border
- Various points in Stockholm (showing much of the NNM Map Viewer functionality)
- Three-country cairn (Sweden, Norway and Finland)
- Latitude zero and longitude zero
- Equator and zero meridian (with markers every 30°)
- Royal castle in Stockholm
- Njurunda church
- Mount Everest
- An interesting part of the 69th latitude
- An interesting part of the 27th longitude
- An interesting part of the 80th longitude
An example of a complete URL:
Create URL automagically
Here is a small form to help you create correct URLs for the NNM Map Viewer.
Here is a simple tool which you can use to URL encode your parameter values.
Convert DMS coordinates to decimal
Here is a simple tool which you can use to convert coordinates in DMS (degrees, minutes, seconds) to decimal. For example
69°15'20" (DMS) is the same as
NNM Map Viewer was originally implemented by Anders Gustafson in November 2018.
Current version, (released )
- Added favicon .
- Using semantic versioning (SemVer) for the releases.
- Version 3.4 (released 2021-01-16)
Version 3.3 (released 2019-10-19)
- Made the height of the map relative in size to the viewport (90%), instead of being fixed sized.
- Upgraded Leaflet JS from 1.4.0 to 1.5.1.
Version 3.2 (released 2019-03-10)
- Added Table of Contents.
Fixed bug with polylines that only allowed
point9will hopefully work as expected.
Version 3.1 (released 2019-02-08)
- Minor bug fixes.
Version 3.0 (released 2019-02-04)
Breaking changes, since the parameter
pointis no longer used (instead use
pointN, where N can be 0-9).
Breaking changes, since drawing polyline instead of polygon, unless explicitly asked for (via parameter
- Possible to define multiple distinct polylines.
- A DMS to decimal converter.
- Breaking changes, since the parameter
Version 2.2 (released 2019-01-19)
- Major refactorings.
- Using classes and a more object-oriented approach.
Version 2.1 (released 2019-01-05)
- A form to help building correct URLs. Added scale. Bug fixes.
Version 2.0 (released 2018-11-22)
- Breaking changes, since the URL parameters look differently than in version 1.0.
- Version 1.0 (released 2018-11-18)
What's in the upcoming versions?
Some of the following may be done in a future version of NNM Map Viewer.
- Enhance user interface.
- Defining size of map.
- Clicking in map and get distance from origo.
- Different layers.
Getting correct current local time via a time API for the coordinates at origo and the marker points, eg a parameter
Feedback on the NNM Map Viewer is highly appreciated, so please, email any comments, questions, suggestions, errata, etc to