An example of a leaflet map set to full screen using appropriate styles.
/index.html
Last active Nov 26, 2019
A full screen leaflet.js map
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Full Screen Leaflet Map</title> | |
| <meta charset="utf-8" /> | |
| <link | |
| rel="stylesheet" | |
| href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" | |
| /> | |
| <style> | |
| body { | |
| padding: 0; | |
| margin: 0; | |
| } | |
| html, body, #map { | |
| height: 100%; | |
| width: 100%; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="map"></div> | |
| <script | |
| src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"> | |
| </script> | |
| <script> | |
| var map = L.map('map').setView([-41.2858, 174.78682], 14); | |
| mapLink = | |
| '<a href="http://openstreetmap.org">OpenStreetMap</a>'; | |
| L.tileLayer( | |
| 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { | |
| attribution: '© ' + mapLink + ' Contributors', | |
| maxZoom: 18, | |
| }).addTo(map); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment