[Avis][Conseil] Script génération labyrinthe

Version imprimable

Bonjour,

Je viens de faire un script de génération de labyrinthe en JavaScript. L'idée de ce script est de généré des labyrinthes pour un jeu en 2D iso, sans passer par le serveur. J'aimerai avoir votre avis dessus.

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
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
clear();
var caracterWall = "#";
var caracterGrass = " ";
Array.prototype.contains = function(obj) {
    var i = this.length;
    while (i--) {
        if (this[i] == obj) {
            return true;
        }
    }
    return false;
}
function isInMapSet(mapSet, value ){
 
for (var index in mapSet){
    if(mapSet[index] instanceof Array){
        if(mapSet[index].contains(value)){
            return true;
        }
    }
}
return false;
}
function getIndexInMapSet(mapSet, value ){
for (var index in mapSet){
    if(mapSet[index] instanceof Array){
 
        if(mapSet[index].contains(value)){
            return index;
        }
    }
}
return false;
}
function mergeIndexInMapSet(mapSet, indexA, indexB){
    if(mapSet[indexA] instanceof Array && mapSet[indexB] instanceof Array ){
        mapSet[indexA] = mapSet[indexA].concat(mapSet[indexB]);
        delete mapSet[indexB];
        return true;
    }
    return false;
}
function displayMap(map){
    for (var x in map){
        if(typeof map[x] !== "function"){
            var line = "";
            for (var y in map[x]){
                if(typeof map[x][y] !== "function"){
                    var line = line+ map[x][y];
                }
            }
            console.log(line);
        }
    }
}
 
var map= new Array();
var x = 10;
var y = 60;
var randomOrder = new Array();
var mapSet =new Array();
for(i=0;i<x*2;i++){
	var line= new Array();
	for(j=0;j<y*2;j++){
		var matsetLine = new Array();
		var entry = new Array();
		if(i%2==0 && j%2==0){
    		matsetLine.push((i/2)+':'+(j/2));
    		mapSet.push(matsetLine);
    		randomOrder.push((i/2)+':'+(j/2));
			line.push(caracterGrass);
		} else {
			line.push(caracterWall);
		}
 
	}
	map.push(line);
}
randomOrder.sort(function() {return 0.5 - Math.random()});
 
for (var i in randomOrder)
{
	if(typeof randomOrder[i] !== "function"){
		var index = randomOrder[i].split(":");
		var posX = index[0];
		var posY = index[1];
		var possible = new Array();
		var currentIndex = posX+ ":"+posY;
		var ouestIndex = (posX-1)+ ":"+posY; 
		if(isInMapSet(mapSet,ouestIndex) && getIndexInMapSet(mapSet, ouestIndex)!= getIndexInMapSet(mapSet, currentIndex)){
			possible.push(ouestIndex);
		}
		var estIndex = (posX+1)+ ":"+posY;
		if(isInMapSet(mapSet,estIndex) && getIndexInMapSet(mapSet, estIndex)!= getIndexInMapSet(mapSet, currentIndex)){
			possible.push(estIndex);
		}
		var nordIndex = posX+ ":"+(posY-1); 
		if(isInMapSet(mapSet,nordIndex) && getIndexInMapSet(mapSet, nordIndex)!= getIndexInMapSet(mapSet, currentIndex)){
			possible.push(nordIndex);
		}
		var sudIndex = posX+ ":"+(posY+1);
		if(isInMapSet(mapSet,sudIndex) && getIndexInMapSet(mapSet, sudIndex)!= getIndexInMapSet(mapSet, currentIndex)){
			possible.push(sudIndex);
		}
		if(possible.length>0){
			var randomNumber=Math.floor(Math.random()*possible.length);
			var posSlip = possible[randomNumber].split(':');
			var posXRand = posSlip[0];
			var posYRand = posSlip[1];
			var wallX = parseInt(posX)+parseInt(posXRand);
			var wallY = parseInt(posY)+parseInt(posYRand);
			map[wallX][wallY] = caracterGrass;
			mergeIndexInMapSet(mapSet, getIndexInMapSet(mapSet,currentIndex), getIndexInMapSet(mapSet, possible[randomNumber]));
		}
	}
}
 
displayMap(map);

Quels sont selon vous les points à améliorer ?

Cordialement,
Patrick Kolodziejczyk.

03/12/2012, 15h57
SylvainPV

Bonjour,

Il s'agit plus d'un problème d’algorithmique que de Javascript, je pense que tu trouveras de meilleurs conseils sur des forums spécialisés sur ce sujet.
03/12/2012, 16h32
kolodz

L'ago fonctionne. Je recherche plus des conseils dans la structure du script. Et dans l'utilisation du langage.
03/12/2012, 18h29
SylvainPV
Eh bien dans l'ensemble le code est clair. Peut-être quelques détails, comme faire attention aux boucles for...in qui peuvent être traîtres selon les objets que l'on parcourt ; et aussi je te suggère de placer toutes tes fonctions dans un namespace afin de ne pas créer trop de variables globales :
Code:

1 2 3 4 5 6 7 (function(app){ app.mavariable = ...; app.mafonction = function(){ ... }; })(window.app || (window.app = {}));
avec app le namespace que tu souhaites. Comme ça tu ne créeras qu'une seule variable globale, qui est le point d'entrée pour tout ton code.

Ah et aussi il est déconseillé d'étendre le prototype des objets natifs comme Array. Mieux vaut passer par un wrapper ou une fonction contains(monArray, maValue)
03/12/2012, 20h37
kolodz

Merci beaucoup. C'est le genre de conseils que je cherchais.

Cordialement,
Patrick Kolodziejczyk.

Je fait un petit up pour ajouter le code correspondant à ma version définitive :

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
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
140
function LabGenerator() {
	this.width = 0;
	this.height = 0;
	this.map= new Array();
	this.mapSet = new Array();
	this.randomOrder = new Array();
	this.caracterWall = "#";
	this.caracterGrass = " ";
}
 
LabGenerator.generateMap = function(width, height) {
        this.caracterWall = "#";
    	this.caracterGrass = " ";
		this.width = width;
		this.height = height;
		this.map= new Array();
		this.mapSet = new Array();
		this.randomOrder = new Array();
		for(i=0;i<this.height*2;i++){
			var line= new Array();
			for(j=0;j<this.width*2;j++){
				var matsetLine = new Array();
				var entry = new Array();
				if(i%2==0 && j%2==0){
					matsetLine.push((i/2)+':'+(j/2));
					this.mapSet.push(matsetLine);
					this.randomOrder.push((i/2)+':'+(j/2));
					line.push(this.caracterGrass);
				} else {
					line.push(this.caracterWall);
				}
			}
			this.map.push(line);
		}
		this.randomOrder.sort(function() {return 0.5 - Math.random()});
		while(this._needDestroyWall()){
			for (var i in this.randomOrder)
			{
				if(typeof this.randomOrder[i] !== "function"){
					var index = this.randomOrder[i].split(":");
					this._destroyWall(index[0], index[1])
				}
			}
		}
	};
LabGenerator._needDestroyWall = function (){
	var count = 0
	for(index in LabGenerator.mapSet){
	if(LabGenerator.mapSet[index]!= null){
		count++
		}
	}
	return count > 1;
}
LabGenerator._destroyWall = function(posX, posY){
				var possible = new Array();
				var currentIndex = posX+ ":"+posY;
				var ouestIndex = (posX-1)+ ":"+posY; 
				if(this.isInMapSet(ouestIndex) && this.getIndexInMapSet(ouestIndex)!= this.getIndexInMapSet(currentIndex)){
					possible.push(ouestIndex);
				}
				var estIndex = (parseInt(posX)+1)+ ":"+posY;
				if(this.isInMapSet(estIndex) && this.getIndexInMapSet(estIndex)!= this.getIndexInMapSet(currentIndex)){
					possible.push(estIndex);
				}
				var nordIndex = posX+ ":"+(parseInt(posY)-1); 
				if(this.isInMapSet(nordIndex) && this.getIndexInMapSet(nordIndex)!= this.getIndexInMapSet(currentIndex)){
					possible.push(nordIndex);
				}
				var sudIndex = posX+ ":"+(parseInt(posY)+1);
				if(this.isInMapSet(sudIndex) && this.getIndexInMapSet(sudIndex)!= this.getIndexInMapSet(currentIndex)){
					possible.push(sudIndex);
				}
 
				if(possible.length>0){
					var randomNumber=Math.floor(Math.random()*possible.length);
					var posSlip = possible[randomNumber].split(':');
					var posXRand = posSlip[0];
					var posYRand = posSlip[1];
					var wallX = parseInt(posX)+parseInt(posXRand);
					var wallY = parseInt(posY)+parseInt(posYRand);
					this.map[wallX][wallY] = this.caracterGrass;
					this.mergeIndexInMapSet(this.getIndexInMapSet(currentIndex), this.getIndexInMapSet(possible[randomNumber]));
				}
}
 
 
LabGenerator.arrayContains = function(array,obj) {
		var i = array.length;
		while (i--) {
			if (array[i] == obj) {
				return true;
			}
		}
		return false;
	};
 
LabGenerator.isInMapSet = function (value){
		for (var index in this.mapSet){
			if(this.mapSet[index] instanceof Array){
				if(this.arrayContains(this.mapSet[index], value)){
					return true;
				}
			}
		}
		return false;
	};
 
LabGenerator.getIndexInMapSet = function ( value){
		for (var index in this.mapSet){
			if(this.mapSet[index] instanceof Array){
				if(this.arrayContains(this.mapSet[index],value)){
					return index;
				}
			}
		}
		return false;
	};
LabGenerator.mergeIndexInMapSet = function (indexA, indexB){
		if(this.mapSet[indexA] instanceof Array && this.mapSet[indexB] instanceof Array ){
			this.mapSet[indexA] = this.mapSet[indexA].concat(this.mapSet[indexB]);
			delete this.mapSet[indexB];
			return true;
		}
		return false;
	};
 
LabGenerator.displayMap = function displayMap(){
		for (var x in this.map){
			if(typeof this.map[x] !== "function"){
				var line = "";
				for (var y in this.map[x]){
					if(typeof this.map[x][y] !== "function"){
						var line = line+ this.map[x][y];
					}
				}
				console.log(line);
			}
		}
	};

Exemple de génération, puis d'affichage :

Code:

1
2
3
4
LabGenerator.generateMap(10,10);
LabGenerator.displayMap();
LabGenerator.generateMap(1,10);
LabGenerator.displayMap();

Pour avoir la carte directement :

Code:

LabGenerator.map

Vérifier si la case x/y est un mur :

Code:

LabGenerator.map[x][y] ==LabGenerator.caracterWall

Cordialement,
Patrick Kolodziejczyk.