HTML5 Map 🌐

Interactive HTML5 Map (Leaflet, standalone)

Open Beta
.html · text/html

Canvas-HTML is a self-contained interactive HTML5 file with a Leaflet.js map. All data for the chosen area is embedded into the file as GeoJSON right inside the JavaScript, so the page opens in any browser without a server and without unpacking — just double-click the .html. The map supports zoom and pan, a layer-visibility toggle, click popups showing a feature's attributes, and basic per-layer styling (roads gray, buildings orange, water blue, greenery green). The OpenStreetMap basemap and the Leaflet library itself load from a CDN, so the background tiles need internet; the embedded GeoJSON layers work offline.

Izvezi HTML5 Map sada ✨ Otvorena beta — besplatno, bez ograničenja

Ključne značajke

A single standalone .html — data embedded, no server required
Interactive Leaflet.js map with zoom, pan and a layer toggle
Click popups showing a feature's attributes (with value escaping)
Per-layer styling (roads, buildings, water, greenery, land use)
Automatic camera fit to the bounds of the chosen area
Example HTML5 Map export (central Moscow, 1x0.5 km)
Example: central Moscow, ~1×0.5 km, medium detail

O formatu HTML5 Map

Canvas-HTML is a ready interactive map packed entirely into a single HTML file. Inside it are the Leaflet library and the data of the selected area as GeoJSON right in the page code, so the file opens with a double click in any browser: no server and no software installation required.

The format is chosen when the map has to be shown to someone rather than processed: sent to a client, attached to a report, put into an internal wiki, demonstrated to a colleague who has no GIS. The person on the other end simply opens the file and works with the map — pans, zooms, clicks on objects.

The map has zoom and panning, a layer switcher and pop-up tooltips with the attributes of an object on click; the layers are colored by type — roads, buildings, water, greenery, land use. The camera is aimed at the bounds of the selected area right away. Up to 50 000 objects are taken per layer so the page stays responsive.

One caveat about the internet: the data itself is embedded in the file and works offline, while the Leaflet library and the OpenStreetMap background are loaded from the network — without internet access only the vector layers on an empty background will remain.

Koji program otvara datoteke HTML5 Map

Sljedeći programi i aplikacije mogu otvoriti, uređivati i raditi s datotekama Interactive HTML5 Map (Leaflet, standalone) (.html) izvezenima iz OSM2CDR-a:

🌐Google Chrome 🌐Mozilla Firefox 💻Microsoft Edge 💻Safari 💻Leaflet.js

Format specifications

Tko koristi karte HTML5 Map

🏗
Quickly sending an interactive map to a colleague or client as a single file
Sending an interactive map as a single file — the recipient needs neither a GIS nor access to the service.
💻
Embedding a map into a report, presentation or internal wiki without a backend
An attachment to a report or a presentation: the map lives next to the document and opens in a browser.
📊
Demonstrating an exported area with clickable feature attributes
A demonstration of the export with attributes: a click shows exactly what is in the data.
🎨
Lightweight data viewing without installing GIS apps — in an ordinary browser
A quick look at the data, when installing QGIS for a single glance is not worth it.

Kako izvesti HTML5 Map

1
Odaberite područje
Nacrtajte pravokutnik ili poligon na interaktivnoj karti na osm2cdr.ru
2
Odaberite HTML5 Map
Odaberite Interactive HTML5 Map (Leaflet, standalone) s popisa od 127 dostupnih formata izvoza
3
Izvoz
Kliknite Izvoz i primite svoju .html datoteku za 1 – 5 minuta
4
Preuzimanje
Preuzmite gotovu datoteku HTML5 Map i otvorite je u Google Chrome

Kako otvoriti nakon izvoza

Popularne karte u formatu HTML5 Map

Besplatno

Nabavite izvoze karata u formatu Interactive HTML5 Map (Leaflet, standalone)

Preuzmite profesionalne karte u formatu HTML5 Map iz OpenStreetMapa. Trenutno generiranje, bilo koje područje.

Besplatno / izvoz
Izvezi HTML5 Map sada →

Često postavljana pitanja

Do I need a server to open the file?
Does the map work without internet?
Is there a data-size limit?
Why does the map show only the selected area?
Can I embed such a map in my own website?
How do I change the layer colors or the background tiles?
Why did the file turn out so large?

Povezani formati

Često se izvoze zajedno