Leaflet Blank Map
11,234
Your reference to the tilemap seems wrong, the code below gives you the tiles.
<!DOCTYPE HTML>
<div id="map"/>
<script type="text/javascript" src="http://cdn.leafletjs.com/leaflet-0.4/leaflet.js"></script>
<script type="text/javascript">
var map = L.map('map').setView([28.23211669921875, -26.050065042385917], 10);
//L.tileLayer('http://b.tilecloudmade.com/e7b61e61295a44a5b319ca0bd3150890/997/256/18/149531/108306.png', {
L.tileLayer('http://{s}.tile.cloudmade.com/e7b61e61295a44a5b319ca0bd3150890/997/256/{z}/{x}/{y}.png', {
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>',
maxZoom: 18
}).addTo(map);
</script>
Author by
Siya
Updated on July 26, 2022Comments
-
Siya almost 2 years
I am doing the Quick Start tutorial for Leaflet and I keep getting a blank map. I'm using JavaScript to initialise the map but even with what I assume are all the write code I still don't see the map. Please help, my code is below:
<!DOCTYPE HTML> <div id="map"> <script type="text/javascript" src="http://cdn.leafletjs.com/leaflet-0.4/leaflet.js"></script> <script type="text/javascript"> var map = L.map('map').setView([28.23211669921875, -26.050065042385917], 10); L.tileLayer('http://b.tilecloudmade.com/e7b61e61295a44a5b319ca0bd3150890/997/256/18/149531/108306.png', { attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>', maxZoom: 18 }).addTo(map); </script> </div> </div>