Search the Community
Showing results for tags 'distortion'.
-
Hello there, the last couple of days I was playing around with Phaser a lot, and I quite like it so far! My current project is supposed to be a kind of side-scrolling Beat'EmUp where the movement and action is turn-based and takes place on a pre-defined grid of rows and columns. Now, the idea was that it has a pseudo-3d look, and thus needs some kind of perspective projection. I've messed around with the Isometric-Plugin for Phaser, but the isometric perspective is not what I'm looking for. The camera would be static (the person is moving from left to right and the tiles on the ground keep scrolling in), so my guess is that it should somehow be possible in Phaser to mimic this effect by matrix manipulation of the coordinates or such. It's been a while I've been doing this, but I'd be willing to look up some maths again for this. I did a Tetris 3D game 2 years ago with Three.js, so I know that this setup is basic in true 3D environments, but for now, I'd like to know if anyone of you guys maybe has experience with things like this in Phaser, because I'd really like to stick with this framework. But if it should be too complicated to implement I'd also maybe have a look at Babylon.js or Three.js once more. As far as I know, those two lack those neat game-mechanics-implementations that Phaser offers...anyway, thanks for reading and taking your time, maybe one of you has an idea!
- 2 replies
-
- transformation
- distortion
-
(and 2 more)
Tagged with:
-
Sprite color distortion --- how do I disable Premultiplied?
UltimateWalrus posted a topic in Pixi.js
Hello, I am experiencing what I think is a quirk of WebGL's premultiplied rendering. My *.PNG sprites are getting rendered with slightly different RGB values than in the source file. However, a *.BMP sprite renders with perfect color, which supports my hypothesis that WebGL's premultiplied alpha is to blame. Basically, I just want to know how to disable premultiplied alpha for a texture in PIXI. Here is a screenshot (pull it up in Photoshop and sample the colors if you don't believe me): : Here is my source: var renderer = PIXI.autoDetectRenderer(800, 600,{backgroundColor : 0x1099bb}); document.body.appendChild(renderer.view); // create the root of the scene graph var stage = new PIXI.Container(); //Create a BMP sprite so we know what the colors are supposed to look like var bmp_spr = PIXI.Sprite.fromImage( 'test.bmp' ); stage.addChild(bmp_spr); //Create a PNG sprite to demonstrate the distorted colors var png_spr = PIXI.Sprite.fromImage( 'test.png' ); png_spr.position.x = 64; stage.addChild(png_spr); //Try to create a non-premultiplied PNG sprite to fix the problem var base_tex = PIXI.BaseTexture.fromImage( 'test2.png' ); base_tex.premultipliedAlpha = false; var tex = new PIXI.Texture( base_tex ); var nomult_spr = new PIXI.Sprite( tex ); nomult_spr.x = 128; stage.addChild( nomult_spr ); // start animating animate(); function animate() { requestAnimationFrame(animate); // render the container renderer.render(stage); }Test images are attached. Normally I'd be all for the speed boost that comes from premultiplying alpha, but it's ruining a shader I'm trying to write, where the tiny color differences butterfly effect out into huge glitches. I tried to disable premultiplied alpha in the source above but it didn't correct the colors, all it did was disable transparency. Thanks for any help! ---Sebastian test.bmp