Get pixel value in a Sprite?

[tackle]

I have a sprite with a PNG enemy badguy in it. PNG has transparancy.

I want to track whether or not a certain x/y position inside of this Sprite is transparant or not.

 

Is there a way to get the pixel value of a Sprite?

 

I noticed in earlier threads there was some talk about using the Canvas Context 'getImageData' however that was perhaps not very smart performance-wise. Also the problem I would face is that this Sprite will be overlaying something that isn't transparant.

 

This is all regarding Canvas mode btw.

[tackle]

Excuse my bump here - just curious if anyone knows a way to do this.

[jcs]

yeah, any time you read from the GPU (like getImageData does), it potentially creates a pipeline stall (almost certainly, according to the chrome engineers - if you google on 'chrome game performance' or the like you can find the talks and/or papers where they talk about this)

 

so if you do this (read from GPU), you want to do it as the very first thing in the render pipeline. even then it could cause performance to degrade. but you're better off trying it and testing than assuming the worst - it may not matter for you.

 

if it does turn out to be unacceptable, you're left trying to track this information yourself. you could create a map of transparent pixels in memory when you first load the image and then check the sprite's current location against that each frame. depending on how many pixels you have to check this may end up being just as slow or slower than hitting GPU memory...

 

good luck!

[tackle]

Has anyone tried doing this and come up with a solution for Canvas mode that is performant enough for 60fps gameplay sprite click detection?

[charlie_says]

Ok, this is a bit rough & ready, but I've pulled it from something that is working... Not sure yet about performance.

var bmd = game.make.bitmapData(100, 100);bmd.draw(game.cache.getImage('yourImage'), 0, 0);bmd.update();var sprite = game.add.sprite(0, 0, bmd);// in your onclick fnvar posX, posY;posX = pointer.x - sprite.x;posY = pointer.y - sprite.y;var hex = bmd.getPixel32(posX,posY);//r = ( hex       ) & 0xFF; // get the r//g = ( hex >>  8 ) & 0xFF; // get the g//b = ( hex >> 16 ) & 0xFF; // get the ba = ( hex >> 24 ) & 0xFF; // get the alphaif (a > 0) {// hit here!}

[tackle]

Thanks a bunch, I'll try it out!

[charlie_says]

hmmm, I just tried my test on iPad, and it doesn't work... so, perhaps, its not a workable solution (there goes my game.)

[charlie_says]

Ok - not sure what the issue is, but it's do with Safari...

 

This works:

col = bmd.getPixel(_posX,_posY);if (col.a > 0){// hit}

I think Rich said somewhere that getPixel is slower than getPixel32 - it may be because it returns an object...