[AS3] Randomly generating tile-based map

[LyonB]

I'm developping a tile-based map that is split into 4 different quadrants, and each quadrant is chosen out of an array whose index is randomly generated.
I have everything working as far as I can tell, when I do a trace for the quadrant's arrays, all 4 arrays are showing up, however, on the X axis, the quadrants seem to be overlapping each other and I can't seem to think of a way to fix this (mostly because the Y axis is NOT overlapping itself)

package {
import flash.display.Sprite;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.Loader;
import flash.geom.Rectangle;
import flash.geom.Point;
import flash.net.URLRequest;
import flash.events.Event;

public class GAME extends Sprite{
private var myParent:Sprite;
private var mapArray:Array;
private var ts:int;
private var mapGridX:int;
private var mapGridY:int;

public function GAME(s:Sprite){
myParent = s;
prepareGame();
}
private function prepareGame(){
ts = 32;
mapGridX = 2;
mapGridY = 2;
mapArray = [
[
[0,0,0,0,1],
[0,0,0,1,1],
[0,0,1,1,1],
[0,1,1,1,1],
[1,1,1,1,1],
],
[
[0,0,0,0,0],
[0,0,0,0,0],
[0,0,1,0,0],
[0,1,1,1,0],
[0,0,0,0,0],
],
[
[0,0,0,0,0],
[0,0,0,0,0],
[0,0,1,0,0],
[0,0,1,0,0],
[0,0,1,0,0],
],
[
[0,0,1,0,0],
[0,0,1,0,0],
[0,0,1,0,0],
[0,0,0,0,0],
[0,0,0,0,0],
],
];
loadBMP()
}
private function loadBMP(){
var loadBMP:Loader = new Loader;
loadBMP.load(new URLRequest("tiles.png"));
loadBMP.contentLoaderInfo.addEventListener(Event.C OMPLETE, onLoaded);
function onLoaded(){
var tilesheetBMP:Bitmap = new Bitmap(new BitmapData(loadBMP.width, loadBMP.height));
tilesheetBMP.bitmapData.draw(loadBMP);
drawTiles(tilesheetBMP);
}
}
private function drawTiles(tilesheetBMP:Bitmap){
for (var yg:int = 0; yg < mapGridY; yg++){
for (var xg:int = 0; xg < mapGridX; xg++){
var Random:Number = Math.floor(Math.random()*mapArray.length);
var curGrid:Array = new Array();
curGrid.push(mapArray[Random]);
var curGridIndex:int = 0;
trace (curGrid[curGridIndex]);
var mapW:int = curGrid[curGridIndex].length;
var mapH:int = curGrid[curGridIndex][0].length;
var gridW:int = mapW*ts;
var gridH:int = mapH*ts;
var bitmapGrid:Bitmap = new Bitmap(new BitmapData(gridW, gridH));
myParent.addChild(bitmapGrid);
for (var yt:int = 0; yt < mapH; yt++){
for (var xt:int = 0; xt < mapW; xt++){
var s:int = curGrid[curGridIndex][yt][xt];
var sheetColumns:int = tilesheetBMP.bitmapData.width/ts;
var col:int = s % sheetColumns;
var row:int = Math.floor(s/sheetColumns);
var rect:Rectangle = new Rectangle(ts * col, ts * row, ts, ts);
var pt:Point = new Point(0,0);
var gridTile:Bitmap = new Bitmap(new BitmapData(ts,ts));
gridTile.bitmapData.copyPixels(tilesheetBMP.bitmap Data,rect,pt,null,null,true);
var bmpRect:Rectangle = new Rectangle(0,0,ts,ts);
var bmpPt:Point = new Point(xt * ts, yt * ts);
bitmapGrid.bitmapData.copyPixels(gridTile.bitmapDa ta, bmpRect, bmpPt, null, null, true);
}
}
bitmapGrid.x+=bitmapGrid.width;
curGridIndex++;
}
bitmapGrid.y+=bitmapGrid.height;
}

}
}

}

This is what it looks like:

http://i38.tinypic.com/25iay2x.png

As you can see, the X axis overlaps, while the Y axis seems to be behaving as intended.

Any ideas?

[LyonB]

EDIT::

I solved the problem.


bitmapGrid.x += xg * gridW;
bitmapGrid.y += yg * gridH;