Problème de requête

pour la map de mon jeu

a marqué ce sujet comme résolu.

Bonjour, je développe actuellement un jeu HTML5. Mon code actuel récupère un fichier JSON avec les données de la map, et la dessine dans un Canvas. Seulement, avant j'utilisais une requête synchrone, donc mon script n'essayait pas de dessiner ma map avant que la requête ne soit finie. Mais maintenant, il essaye avant que la requête ne soit finie (je suis passé en requête asynchrone étant donné que Firefox me le déconseillait, et ça ne marchait pas sous chrome); cela provoque une erreur et le code bloque. Comment faire pour que tout ça marche ? Voila mon code:

 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
function Map(tilewidth, widthintile) {
    this.tilewidth = tilewidth;
    this.widthintile = widthintile;
    this.getJsonData = function (source) {
        this.source = source;
        this.xhr = new XMLHttpRequest();
        this.xhr.open("GET", this.source);
        this.xhr.addEventListener('readystatechange', function() {
    if (this.xhr.readyState === 4 && this.xhr.status === 200) {
        this.mapData = this.xhr.responseText;
        this.mapJsonData = JSON.parse(this.mapData);
        this.terrain = this.mapJsonData.terrain;
        this.tileset = new Tileset(this.mapJsonData.tileset, this.tilewidth, this.widthintile);
            }

}.bind(this));
             this.xhr.send(null);
    };
        this.drawMap = function() {
        for (var i = 0, l = this.terrain.length; i < l; i++) {
            var line = this.terrain[i];
            var y = i * this.tileset.tilewidth;
            for (var j = 0, k = line.length; j < k; j++) {
                this.tileset.drawTile(line[j], j * this.tileset.tilewidth, y);

            }
        }
    };
}

Sort this.terrain is undefinied. Comment régler mon problème ? Merci d'avance :) !

+0 -0

Re-bonjour, j'ai essayer de changer d'architecture, mais rien ça ne marche toujours pas sur chrome :/ .Pourtant, si je fais un drawMap() dans la console, la map s'affiche sans problème.. Voici le code:

 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
function Map(tilewidth, widthintile) {
    this.tilewidth = tilewidth;
    this.widthintile = widthintile;
    this.getJsonData = function (source) {
        this.source = source;
        this.xhr = new XMLHttpRequest();
        this.xhr.open("GET", this.source);
       this.xhr.addEventListener('readystatechange', function() {
    if (this.xhr.readyState === 4 && this.xhr.status === 200) {
        this.mapData = this.xhr.responseText;
        this.mapJsonData = JSON.parse(this.mapData);
        this.terrain = this.mapJsonData.terrain;
        this.tileset = new Tileset(this.mapJsonData.tileset, this.tilewidth, this.widthintile);
        this.drawMap();
    }
            }.bind(this));
        this.xhr.send(null);
    };
        this.drawMap = function() {
        for (var i = 0, l = this.terrain.length; i < l; i++) {
            var line = this.terrain[i];
            var y = i * this.tileset.tilewidth;
            for (var j = 0, k = line.length; j < k; j++) {
                this.tileset.drawTile(line[j], j * this.tileset.tilewidth, y);

            }
        }
    };
    this.drawDecor = function() {
     for (var i = 0, l = this.decor.length; i < l; i++) {
            var line = this.decor[i];
            var y = i * this.tileset.tilewidth;
            for (var j = 0, k = line.length; j < k; j++) {
                this.tileset.drawTileDecor(line[j], j * this.tileset.tilewidth, y);

            }
        }
    };
+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte