Problème de portée d'une variable

Résolu
europe21 Messages postés 62 Date d'inscription   Statut Membre Dernière intervention   -  
europe21 Messages postés 62 Date d'inscription   Statut Membre Dernière intervention   -
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 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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 62 Date d'inscription   Statut Membre Dernière intervention  
 
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 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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 62 Date d'inscription   Statut Membre Dernière intervention  
 
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 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
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 62 Date d'inscription   Statut Membre Dernière intervention  
 
Ok merci je vais essayé.
0
europe21 Messages postés 62 Date d'inscription   Statut Membre Dernière intervention  
 
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