Problème de portée d'une variable

Résolu/Fermé
europe21 Messages postés 63 Date d'inscription mardi 26 décembre 2017 Statut Membre Dernière intervention 4 février 2024 - Modifié le 26 déc. 2017 à 13:40
europe21 Messages postés 63 Date d'inscription mardi 26 décembre 2017 Statut Membre Dernière intervention 4 février 2024 - 28 déc. 2017 à 13:55
Bonjour a tous, j'ai un problème de portée d'une de mes variables dans mon objet .Le problème de mon code c'est que j' essaie d'accéder à marker en dehors de la fonction anonyme.

Voici mon code:

ar googleMap = {
    map: "",
    markers: [],
    urlDecaux: "https://api.jcdecaux.com/vls/v1/stations?contract=Paris&apiKey=8a21045d07375cf3ca1a9fbd663ca141df365f16",
    marker:"",
 
init:function initMap() {
    //Constructeur crait une nouvelle map- il faut seulement le centre et le zoom.
    googleMap.map = new google.maps.Map(document.getElementById('map'), {
        center: {
            lat: 48.866667
            , lng: 2.333333
        }
        , zoom: 15
    });
    // Position des endroit a marquer
    ajaxGet(googleMap.urlDecaux, function (reponse) {
        // Transforme la réponse en un tableau d'articles
        var locations = JSON.parse(reponse)
        console.log(locations)
        var largeInfowindow = new google.maps.InfoWindow();
        var bounds = new google.maps.LatLngBounds();
        // Le groupe suivant utilise le tableau d'emplacement pour créer un tableau de marqueurs à l'initialisation.
        for (var i = 0; i < locations.length; i++) {
            // Récupère la position du tableau de localisation.
            var position = locations[i].position;
            var name = locations[i].name;
            var address = locations[i].address;
            var status = locations[i].status;
            var available_bike_stands = locations[i].available_bike_stands;
            var available_bikes = locations[i].available_bikes;
            var icon = {
                url: '/img/marker vert.png', // url
                scaledSize: new google.maps.Size(45, 45), // scaled size
                origin: new google.maps.Point(0, 0), // origin
                anchor: new google.maps.Point(0, 0) // anchor
            };
            var iconBleu = {
                url: '/img/google-maps-md.png', // url
                scaledSize: new google.maps.Size(45, 45), // scaled size
                origin: new google.maps.Point(0, 0), // origin
                anchor: new google.maps.Point(0, 0) // anchor
            };
            // Crée un marqueur par emplacement et le place dans le tableau des marqueurs.
            var marker = new google.maps.Marker({
                map: googleMap.map
                , icon: icon
                , position: position
                , name: name
                , address: address
                , status: status
                , available_bike_stands: available_bike_stands
                , available_bikes: available_bikes
                , animation: google.maps.Animation.DROP
                , id: i
            });
            if (locations.status = "CLOSE") {
                icon = iconBleu;
            }
            else { // nombre <= 0
                icon = icon;
            };
            //Rajoute le marqueur sur notre tableau de marqueurs
            googleMap.markers.push(marker);
            // Crée un événement onclick pour ouvrir une infowindow à chaque marqueur.
            marker.addListener('click', function () {
                infoTableau(this);
            });
             
             
             
        }
    });
},
 
 
 
}
function infoTableau(marker, info) {
    document.getElementById("reservation").style.visibility = "visible";
    document.getElementById("station").innerHTML = marker.name;
    document.getElementById("address").innerHTML = marker.address;
    document.getElementById("statut").innerHTML = marker.status;
    document.getElementById("placeDispo").innerHTML = marker.available_bike_stands;
    document.getElementById("veloDispo").innerHTML = marker.available_bikes;
 
}
button01.addEventListener("click", function () {
    document.getElementById("cadre").style.visibility = "visible";
});
 
document.getElementById('confirm').addEventListener("click", function () {
    <span style="color:#ff0000;">document.getElementById("recap").innerHTML ='1 vélo reserver à la station '+ marker.name+ ' pour ';
   var rebour = Object.create(chrono);
    setInterval('chrono.secondPassed()', 1000);
    document.getElementById("cadre").style.visibility = "hidden";
});

EDIT : Ajout du LANGAGE dans les balises de code (la coloration syntaxique).

Explications disponibles ici :ICI

Merci d'y penser dans tes prochains messages.
Jordane45

Comment puis réutiliser ma variable? Si quelqu'un pouvait m'aider,merci.
stephan

3 réponses

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
26 déc. 2017 à 13:42
Bonjour,

Tu déclares ta variable en dehors de toute fonction.
Elle sera ainsi "globale"

Exemple :
var id;

function truc(){
   id = 10;
}

function test(){
  alert(id);
} 
 

function bidule(){
  truc();
  test();
  //on rechange l'id :
  id=60;
  test();
}

budule();

0
europe21 Messages postés 63 Date d'inscription mardi 26 décembre 2017 Statut Membre Dernière intervention 4 février 2024
26 déc. 2017 à 14:06
oui mais comment faire dans mon cas. car j'ai besoins des propriétés de cette variable qu'elle possède a l'interieur de cette fonction anonyme,je ne sais pas si je suis clair. En fait il faut que je recupere la valeur de marker.name pour l'afficher autre part dans ma page.
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
26 déc. 2017 à 20:55
Tu déclares marker en dehors des fonctions.... (comme tu l'as fait pour les autres variables au début de ton script).
La variable marker.name sera donc accessible de partout dans ton code.....

Mais... sans savoir ce que tu veux exactement en faire... dur de t'en dire plus
0
europe21 Messages postés 63 Date d'inscription mardi 26 décembre 2017 Statut Membre Dernière intervention 4 février 2024
27 déc. 2017 à 10:12
Merci pour ta patience.
J'ai essayé de la mettre en dehors de fonctions mais cela ne marche pas.
En fait j'ai quelques contraintes qui me sont imposé dans mon projet. Le code doit être orienté objet, et il doit y avoir un fichier par objet.
J'ai ma map avec la position des stations velib,quand je clic sur une station je recupere les infos dans mon tableau d'info qui apparait. ensuite si on valide, un canvas signature apparait(jusqu'ici c'est bon), et si on confirme le canvas un message doit apparaitre(qui en principe doit etre mon objet "reservation") avec le nom de la station(c'est la que je doit recuperer "marker.name") et une minuterie pour limiter la reservation et conserver cela dans un session storage.
je te donne mon lien, ne fait pas attention au design du site je n'y ai pas encore travaillé dessus:
http://velib.stephan-serri.compteweb.com/
merci de ton aide
0
jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
27 déc. 2017 à 10:48
Je ne suis pas allé voir ton site ..
mais :

J'ai ma map avec la position des stations velib,quand je clic sur une station je recupere les infos dans mon tableau d'info qui apparait. ensuite si on valide, un canvas signature apparait(jusqu'ici c'est bon), et si on confirme le canvas un message doit apparaitre(qui en principe doit etre mon objet "reservation")

Comment fais tu pour passer de :
je clic sur une station je recupere les infos dans mon tableau d'info qui apparait.--->>> si on valide, un canvas signature apparait(jusqu'ici c'est bon)

Pour la suite.. tu n'as qu'à procéder de la même manière ... tu transmets les infos que tu as dans ton canvas vers la confirmation.
Je ne comprend pas où est le souci....

Donc.. soit tu fais transiter les variables dans les paramètres de tes fonctions ..... soit tu initialise un objet (en dehors de toutes fonctions...) que tu remplis avec les infos souhaitées ... et qui seront alors accessibles depuis toutes tes autres fonctions (ce que je te décrie depuis le début).
0
europe21 Messages postés 63 Date d'inscription mardi 26 décembre 2017 Statut Membre Dernière intervention 4 février 2024
27 déc. 2017 à 11:15
Ok merci je vais essayé.
0
europe21 Messages postés 63 Date d'inscription mardi 26 décembre 2017 Statut Membre Dernière intervention 4 février 2024
28 déc. 2017 à 13:55
Merci beaucoup,grâce a tous tes conseils j'ai réussi.
J'avoue que je n'est pas encore acquis toute la logique javascript.
0