[UrbanTwitch]

I am taking a tilesheet (http://mystikrpg.com/images/all_tiles.png) and trying to split it up into 32x32 graphic tiles and putting them into a 2D array. Then testing out to draw them so like drawImage(tileData[2]) would draw the tile in array tileData[2]. Anyway.

In this line near the bottom of the code:

context.putImageData(tileData[ i ], Math.random() * canvas.width, Math.random() * canvas.height );

I get: Uncaught TypeError

Before you say, yeah, security error in whatnot.. that's why I test this under my localhost on WAMP.

Here is the code

var tileData = [];

var tileWidth, tileHeight
var ImageWidth = 736;
var ImageHeight = 672;
var tileWidth = 32;
var tileHeight = 32;
var tilesX;
var tilesY
var totalTiles;
canvas = document.getElementById("canvas");
canvas.width = ImageWidth;
canvas.height = ImageHeight;
context = canvas.getContext("2d");

var imageObj = new Image();
imageObj.src = "all_tiles.png";
imageObj.onload = function() {
  context.drawImage(imageObj, 0, 0);
// draw the image to canvas so you can get the pixels context.drawImage(imageObj, 0, 0);

  tilesX = ImageWidth / tileWidth;
  tilesY = ImageHeight / tileHeight;
  totalTiles = tilesX * tilesY;
  for(var i=0; i<tilesY; i++) {
    for(var j=0; j<tilesX; j++) {
      // Store the image data of each tile in the array.

      tileData.push(context.getImageData(j*tileWidth, i*tileHeight, tileWidth, tileHeight));
    }
  }

  // test it...
  // blank the canvas and draw tiles back in random positions 
  context.fillStyle = "rgba(255,255,255,1)";
  context.fillRect(0,0,canvas.width, canvas.height);
  for ( i = 0; i < 20; i++ ) {
    context.putImageData(tileData[ i ], Math.random() * canvas.width, Math.random() * canvas.height );
  }

};

[Dormilich]

TypeError (do you also have an error message for that?) usually means that on of the parameters doesn’t fit in its type. since I don’t see anything wrong with the ImageData object (though that should be verified as well), I guess that putImageData() does expect whole numbers for the position (Math.random() * a_number usually does not yield one).