Bonjour,

J'aimerais afficher le contenu d'un objet dans une fenêtre popup.
Cela fonctionne si cet objet est un Array pur et aussi si il est écrit en JSON.
Cependant, quand j'écris mon objet en JSON avec du tableau dedans, il y a un décalage dans l'affichage. Et là je tourne en rond.

Il y a 4 objets (myObject0 à my Object3) et ceux sont les deux derniers qui me pose problème.

Voci le code :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
<script language="JavaScript">
//<!--
var textObject = "";
var indent = "";
var deep = 0;
 
// affichage des éléemnts d'un objet;
function listObject(object, nbindent, maxdeep) {
    var decal = '-----';
    var textObject = "";
 
    for (var i in object) {
        // nom de la propriété
        textObject += nbindent + "<b>" + i + "</b> : ";
        if (typeof(object[i]) == "object" && deep < maxdeep) {
            deep++;
            decal += nbindent;
            textObject += "<br />" + listObject(object[i], decal, maxdeep);
        }
        else {
            // valeur de la propriété
            deep = 0;
            textObject += object[i] + "<br />";
        }
    }
    return (textObject);
}
 
function retourObj (object, indent, deep) {
    w=open("",'popup','width=400,height=400,toolbar=no,scrollbars=yes,resizable=yes');
    w.document.write("<HTML><HEAD>");
    w.document.write("<meta http-equiv=\"content-type\" content=\"text/html; charset=UTF-8\">")
    w.document.write("<TITLE></TITLE></HEAD>");
    w.document.write("<BODY><FONT face='arial' size=1>");
    w.document.write("<h3>Propri&eacute;t&eacute;s de \"" + object + "\"</h3>");
    var evalObject = eval(object);
    w.document.write ( (object) ? listObject(evalObject, indent, deep) : "Ce n'est pas un object");
    w.document.write("</FONT></BODY></HTML>");
    w.document.close();
}
 
var myObject3 =
{"markers": [
     {"lat":43.65654, "lng":-79.90138, "html":"Some stuff to display in the First Info Window","label":"Marker One"},
     {"lat":43.91892, "lng":-78.89231, "html":"Some stuff to display in the Second Info Window","label":"Marker Two"},
     {"lat":43.82589, "lng":-79.10040, "html":"Some stuff to display in the Third Info Window","label":"Marker Three"}
   ],
   "lines": [
       {"colour":"#FF0000", "width":2, "points":[ {"lat":43.65654 ,"lng":-79.90138 },
                                                  {"lat":43.91892 ,"lng":-78.89231 },
                                                  {"lat":43.82589 ,"lng":-79.10040 }
                                                ]
       },
       {"colour":"#008800", "width":4, "points":[ {"lat":43.9078 ,"lng":-79.0264 },
                                                  {"lat":44.1037 ,"lng":-79.6294 },
                                                  {"lat":43.5908 ,"lng":-79.2567 },
                                                  {"lat":44.2248 ,"lng":-79.2567 },
                                                  {"lat":43.7119 ,"lng":-79.6294 },
                                                  {"lat":43.9078 ,"lng":-79.0264 }
                                                ]
       }
   ]
}
 
var myObject2 =
{ "Itineraire" :
    { "nom" : "iti-1",
      "Etapes" : [
          { "nom" : "etape-1",
            "coordonnees": [
                  {"lat" : "120.1234", "lng" : "3.12345", "typepoly" : "0"},
                  {"lat" : "121.1234", "lng" : "3.12345", "typepoly" : "0"},
                  {"lat" : "122.1234", "lng" : "3.12345", "typepoly" : "0"},
                  {"lat" : "123.1234", "lng" : "3.12345", "typepoly" : "1"},
                  {"lat" : "124.1234", "lng" : "3.12345", "typepoly" : "0"}
            ]
          },
          { "nom" : "etape-2",
            "coordonnees": [
                  {"lat" : "130.1234", "lng" : "3.12345", "typepoly" : "1"},
                  {"lat" : "131.1234", "lng" : "3.12345", "typepoly" : "1"},
                  {"lat" : "132.1234", "lng" : "3.12345", "typepoly" : "1"},
                  {"lat" : "133.1234", "lng" : "3.12345", "typepoly" : "1"},
                  {"lat" : "134.1234", "lng" : "3.12345", "typepoly" : "0"}
            ]
          }
      ]
    }
};
 
 
var myObject1 = {
    "P" : {
          "P-1" : "p-1",
          "P-2" : "p-2"
    },
    "Q" : "q-1",
    "R" : {
          "R1" : {
                 "R2" : "r-2",
                 "R3" : "r-3"
          }
 
    }
}
 
var myObject0 =
["a",
  ["b", "c",
            ["d0", "d1", "d2", "d3"
            ],
  ],
  "e", "f",
            ["g0", "g1", "g2"
            ],
];
 
 
// -->
</script>
</script>
</head>
  <body>
    <form>
      Entrez un objet du modèle :
      <input type="text" id="valObject" name="" value="myObject0"><br>
      Profondeur de visuatisation :
      <input type="text" id="deepObject" name="" value="5"><br>
      <input type="button" value="Voir les propriétés" onClick="retourObj(document.getElementById('valObject').value, indent, document.getElementById('deepObject').value)">
    </form>
  </body>
</html>
Merci pour vos réponses.

Jean-Luc