Utiliser des données sur 2 fichiers javascript différents

Fermé

Utilisateur anonyme - 28 déc. 2018 à 10:47
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 - 28 déc. 2018 à 12:01

Bonjour à tous,
Je réalise actuellement un projet dans le cadre de mon cursus d'apprentissage du développement web. Je suis débutant en javascript et je rencontre la difficulté suivante :
Je dois mettre en place une carte de location de vélo, en utilisant l'API JC Decaux. Pour la carte, j'utilise Leaflet.

J'arrive à récupérer les données concernant les stations vélos, cependant lorsque j'essaie de lier ces données à la carte, j'ai des messages d'erreurs.

Voici le code:

HTML

<!DOCTYPE html>
<html>
	<head>
        <meta charset="utf-8">

        <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
			crossorigin="" />
			<link rel="stylesheet" type="text/css" href="carte/style-carte.css"/>
        <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw=="
            crossorigin=""></script>

		<title>Projet 3</title>
	</head>
	<body>
		<div id="map">
		</div>
	</body>

	<script src="api_jcdecaux/ajax.js" type="text/javascript"></script>
	<script src="api_jcdecaux/js-apivelo.js" type="text/javascript"></script>
	<script src="carte/carte.js" type="text/javascript"></script>

</html>

AJAX

// Exécute un appel AJAX GET
// Prend en paramètres l'URL cible et la fonction callback appelée en cas de succès
function ajaxGet(url, callback) {
    var req = new XMLHttpRequest();
    req.open("GET", url);
    req.addEventListener("load", function () {
        if (req.status >= 200 && req.status < 400) {
            // Appelle la fonction callback en lui passant la réponse de la requête
            callback(req.responseText);
        } else {
            console.error(req.status + " " + req.statusText + " " + url);
        }
    });
    req.addEventListener("error", function () {
        console.error("Erreur réseau avec l'URL " + url);
    });
    req.send(null);
}

VELOS

var tableau;
console.log(tableau);
    function afficher(reponse) {
        var infos = JSON.parse(reponse);
        infos.forEach(element => {
            var tableau = [element.name, element.position.lat];
        });
    }
        ajaxGet("https://api.jcdecaux.com/vls/v1/stations?contract=Lyon&apiKey=789c165dfe2e6ce623f45b8e2c5f44a9321931bc", afficher);

CARTE



var lat = 45.750000;
var lon = 4.850000;
var macarte = null;

function initMap() {

    macarte = L.map('map').setView([lat, lon], 11);

    L.tileLayer('https://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png', {

        attribution: 'données © <a href="//osm.org/copyright">OpenStreetMap</a>/ODbL - rendu <a href="//openstreetmap.fr">OSM France</a>',
        minZoom: 1,
        maxZoom: 20
    }).addTo(macarte);
    var marker = L.marker([lat, lon]).addTo(macarte);
}
window.onload = function(){
    initMap(); 
};

#map {
    width: 800px;
    height: 500px;
}

Je souhaite pouvoir réutiliser la variable tableau au sein de mon code CARTE, afin de pouvoir assimiler ces données à la variable marker (pour pouvoir positionner les marqueurs aux coordonées gps des stations vélo).

Merci d'avance pour votre aide.

Bonne journée.

A voir également:

Utiliser des données sur 2 fichiers javascript différents
Comment utiliser chromecast - Guide
Wetransfer gratuit fichiers lourd - Guide
Telecharger javascript - Télécharger - Langages
2 comptes whatsapp - Guide
Fusionner 2 fichiers excel - Guide

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
28 déc. 2018 à 12:01

Bonjour,

Premièrement... tu as un "var" en trop

 infos.forEach(element => {
            var tableau = [element.name, element.position.lat];
        });

ce qui réinitialise ton tableau à chaque tour de boucle...

Sachant que tu as déjà initialisé ton tableau au dessus

var tableau;

En plus, si tu as plusieurs elements à stocker dans ce tableau.. il faut faire un push
car là.. seule la dernière valeur sera présente dans ta variable.

Ensuite, dans le code carte .. d'où vient ta variable "L" ?
Et à quel moment fais tu le lien entre ta variable tableau et tes marker ?

Et pour finir.. tu nous dis avoir des messages d'erreur....ben..ça serait bien de nous les indiquer !

Discussions similaires

Comment ouvrir 2 documents Excel sur 2 écrans ?

comment donner les droits sur fichier partage

Chemin Logo du site de la Cité de l'espace

Discussions similaires

Newsletters