0

Basically I have 200 X 200 px canvas, a voxel which is 20 X 20 X 20 px. So I have 100 voxels. When I draw on canvas, I want to see which pixel is drawn and if that pixel is inside one of the voxel then I will display that voxel.

Below voxelWidthPixel is number of pixels in width of voxel and voxelHeightPixel is number of pixels in height of voxel. I'm using a loop so that I read pixel values from (0,0) to (20,20) then (0, 20 ) to (20, 40) then (0, 40) to (20, 60) and eventually to (180, 160) to (200, 180) and then (180, 180) to (200, 200).

for (var i =bottomleft.x, px =0 ; i < topRight.x; i = i + voxelSize, px = px + pixWidthVoxel){
    for (var j = bottomleft.y, py =0 ; j < topRight.y ; j = j + voxelSize, py = py + pixHeightVoxel){

        var pixelValues = new Uint8Array(voxelWidthPixel * voxelHeightPixel * 4);
        gl.readPixels( startPixelX, startPixelY, endPixelX, endPixelY, gl.RGBA, gl.UNSIGNED_BYTE, pixelValues);
    }
}

Shouldn't pixelValues be arrayBuffer of size = 20 * 20 * 4 = 1600? And since I'm only reading from (0,0) to(20,20) and then (0, 20) to (20,40), the square from (0,0) to (20,20) will hold 400 pixels. Shouldn't pixelvalues be enough to get all RGBA values??

spuemaacne
  • 219
  • 2
  • 4
  • 15
  • The 3rd and 4th arguments for readPixels are width and height, the names of your variables endPixelX and endPixelY would suggest you have supplied the wrong dimensions for the read. That would explain the error but without more information it is not possible to determine if this is the problem. – Blindman67 Nov 06 '15 at 05:31
  • @Blindman67 Should that width and height be of canvas? Cannot it be like portion of canvas? I'm dividing my canvas into small section of 20 X 20px and giving bottomLeft and topRight coordinate of this small section. – spuemaacne Nov 06 '15 at 05:57
  • The two values should be 20 and 20 which should be `endPixelX-startPixelX` and `endPixelY - startPixelY` I have chect the documentation and width and height is what is required. – Blindman67 Nov 06 '15 at 06:38
  • @Blindman67 Yeah putting endPixelX - startPixelX and endPixelY - startPixelY solved the problem. Thanks – spuemaacne Nov 06 '15 at 09:45
  • Good stuff. Ill write it up as a quick answer. – Blindman67 Nov 06 '15 at 10:46

1 Answers1

1

The 3rd and 4th arguments for gl.readPixels are width and height values. Replace the two values endPixelX and endPixelX with endPixelX-startPixelX and endPixelY - startPixelY

Blindman67
  • 51,134
  • 11
  • 73
  • 136