SEEMAP
Embed maps easily with a single HTML file
A single HTML map file bundled with customizable popular Leaflet plugins, map providers and its own API. SEEMAP for Standalone EmbEddable Map is a single HTML file bundled of useful and popular Leaflet/OpenStreetMap resources in a easy way to embed.
Description | |
---|---|
Download link to the latest version of SEEMAP | Download |
Uncompressed page size | 1.6Mb |
Compressed page size (through HTTP2 or ZIP) | 190Kb |
Typical embed size through an iframe (with tiles) | 500Kb |
PageSpeed Insights test on mobile | Test now |
PageSpeed Insights test on desktop | Test now |
- One single HTML file
Ready to embed via iframe tag or directly through the browser, every feature is included. - Customizable
Set your own default settings. - API through URL GET parameters
Override your default parameters through URL GET parameters. - View
Set a default view and override the map geographical center through API - Markers
Add as much markers with latitude and longitude through URL GET parameters. - Marker clusters
When markers density is to high, provides beautiful animated marker clustering. - Gesture handling
Brings the basic functionality of Google Maps Gesture Handling into Leaflet. Prevents users from getting trapped on the map when scrolling a long page. - Routing Machine
Easy way to get distance and itinerary between multiple markers. - Autocomplete
OpenStreetMap search engine available into a simple autocompletion list. - Permalink
Permalink control button allows visitors to always get the direct link to the current view, useful to share the map view Learn more - Reset view
Reset view control button allows visitors to go back to the very first view of their current session, or to the SEEMAP’s default settings Learn more
Use cases
As a web developer/designer/redactor, you have multiple project onto which quickly embed map without reinstall and configure Leaflet and common plugins each time.
As a web developer/designer/redactor, you have one or multiple coordinates to quickly place on an embedded map.
The following code is the featured example:
<!-- Include SEEMAP as an iframe tag -->
<iframe src="../../seemap.html"></iframe>
<!-- DEMO ONLY -->
<style>
iframe {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}
</style>