In short, this module allows user build web map as soon as possible by simple options.
No third-party Map Framework dominates. This module just creates an interface to connect options and pre-defined map renderer.
Create an HTML file with the following lines:
<div class="map"></div>
<script type="module" src="https://unpkg.com/mapclay@latest/js/mapclay.js"></script>mapclay.js simply renders elements with class="map"(by default) as web map:
Here is another example:
<pre class="map">
use: maplibre
width: 40vw
height: 300px
center: [142.73, 43.83]
</pre>
<div class="map"></div>
<script type="module" src="https://unpkg.com/mapclay@{VERSION}/js/mapclay.js"></script>Here is the result, another map is rendered:
In this case, a new element with class="map" is added. Its text is used to configure a map.
<pre> is used instead to preserve the newlines in text.
For each option:
use: maplibre: Here we use maplibre as map renderer
width: 40vw: The map's width should occupy half of viewport
hieght: 300px: And height should be 500px.
center: [142.73, 43.83]: The center of map is 140.73E 43.83N (Hokaido).
Each renderer has its own default way to render a map. By default, maplibre use demotiles as its basemap.
Modern web maps are developed by many JavaScript libraries. Many of them are good, have fancy GIS supports and clear documentaion. But to make a web map with them, adequate frontend knowledge are necessary.
As a hiker and a part-time volunteer of rescue, I have many friends who need to create digital maps for a variety of activities. Since most of them are not developer, their solutions are QGIS, Garmin BaseCamp or Google My-Map/Earth.
These solutions have better UI, but none of them can fulfill the followings at the same time:
- Easily integrated into a web page
- Open source solution and no 3rd party service needed
- Quickly create/modify contents
- Require minimal GIS/Coding knowledge
In short, mapclay is the abstraction for those use cases.
Read wiki page for more information:
Since I am not a frontend guy, source code should break some conventions or need some modern stacks. Feel free to open an issue or PR for what you see.