Skip to main content

MapML Quick Start Guide

Learn how to quickly create your first map.

View the HTML code shown in the video
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Getting Started</title>
	<script type="module" src="https://cdn.jsdelivr.net/npm/@maps4html/mapml@latest/dist/mapml.js"></script>
</head>
<body>
	<mapml-viewer width="800" height="400" projection="OSMTILE" zoom="1" lat="60.0" lon="-100.0" controls>
		<map-layer label="OpenStreetMap" src="https://maps4html.org/web-map-doc/demo/data/osm.mapml" checked></map-layer>	
	</mapml-viewer>
</body>
</html>

Continue with the next tutorial (MapML Introduction) for a more detailed look.