leaflet.html

!Doctype html>

<html lang="en">

<head>
	<meta charset="utf-8">
	<title>Schools</title>
	<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
	<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>

<body>
	<div id="mapid" style = "height:1000px;width:100%; "></div>
	
	<script>
	var mymap = L.map('mapid').setView([37.7749, -122.4194], 13);
		
	L.tileLayer('http://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png', {
	maxZoom: 19,
	attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, Tiles courtesy of <a href="http://hot.openstreetmap.org/" target="_blank">Humanitarian OpenStreetMap Team</a>'
}).addTo(mymap);
	
	var marker = L.marker([37.7219, -122.4782]).addTo(mymap);
	marker.bindPopup("<b>Hello world!</b><br>I am a popup.").openPopup();
	</script>

</body>