Search the Community
Showing results for tags 'leaflet'.
Found 1 result
-
Hey guys, I am trying to add a open source map known as leaflet i am not having so much of an issue adding the map , as i am the map not showing up correctly. I have tried adding this to my webpage i am creating for a client, but through the layout i have, i was not able to correctly match the style. I then went to a demo page to see if i can simply load the map by itself. i added the .js file , css , and rel link in the html. like i said the map shows up correctly, but when it does show up the map is out of sync. the tiles do not match, and the city is like a puzzle that you must solve. I tried reducing the amount of tiles being shown and the location of the geo points. Still the map in unusable. here is the code: <html> <head> <title>Demo Page</title> <style> #map { height: 180px; } </style> </head> <link rel="stylesheet" type="text/css" href="style1.css" media="all"> <link rel="stylesheet" type="text/css" href="leaflet.css" media="all"> <script type="text/javascript" src="js/leaflet.js"></script> <script> window.onload = function(){ var map = L.map('map').setView([51.505, -0.09], 13); OR var map = L.map('map').setView([30.0, 0], 5); L.tileLayer('http://{s}.tile.cloudmade.com/8c0868ce935a4be48aea8d55f5f04e79/116859/256/{z}/{x}/{y}.png', { attribution: 'Select a City you would like to see', maxZoom: 15 }).addTo(map); } </script> <body> <div id="map"></div> </body> Any suggestions as to how to get these in order to show the map correctly ? Thanks guys
