Code qui ne marche pas - Carte OpenStreetMap non affiché
Résolu
Mahnoj
Messages postés
10
Statut
Membre
-
Mahnoj Messages postés 10 Statut Membre -
Mahnoj Messages postés 10 Statut Membre -
Bonjour à tous,
Je me permets de demander votre aide car j'ai suivi un tuto sur internet proposant une méthode pour intégrer une carte OSM sur un site internet cependant, celui-ci ne me donne rien.
Voici le code html :
Voici le fichier exemple.js
Pensez-vous qu'il y a une erreur de code ou que la méthode ne fonctionne simplement plus.
Je vous remercie d'avance pour vos retours.
Je me permets de demander votre aide car j'ai suivi un tuto sur internet proposant une méthode pour intégrer une carte OSM sur un site internet cependant, celui-ci ne me donne rien.
Voici le code html :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.js"></script>
<script src="exemple.js"></script>
<div id="map" style="height: 400px"></div>
</head>
<body onload="InitialiserCarte() ;">
</body>
</html>
Voici le fichier exemple.js
function InitialiserCarte() {
var map = L.map('map').setView([45.7531152, 4.827906], 17);
var tuileUrl = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png';
var attrib='Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors';
L.TileLayer(tuileUrl, {minZoom: 8, maxZoom: 18, attribution: attrib}).addTo(map);
}
Pensez-vous qu'il y a une erreur de code ou que la méthode ne fonctionne simplement plus.
Je vous remercie d'avance pour vos retours.
1 réponse
-
Salut,
Ta div #map doit être placée à l'intérieur de la balise body et non à l'intérieur de la balise head.
N'hésite pas à regarder la console de développement web de ton navigateur (raccourci F12) pour voir les erreurs javascript.
Bonne journée,
Bonne journée-
Bonjour Pitet,
Je te remercie pour ta réponse. Après avoir changé la position du "div", cela ne marche toujours pas.
Mais en regardant la console de développement, celui-ci m'indique queL.TileLayer(tuileUrl, {minZoom: 8, maxZoom: 18, attribution: attrib}).addTo(map);n'est pas définie.
}
Je vais essayer de comprendre cela.
Je te remercie énormément pour ton aide.
Très bonne journée à toi. -
-
