Pixi Raycaster

[1-800-STAR-WARS]

You might have seen the 265 line js raycaster going around recently - I decided to give it a shot myself on this cloudy Sunday afternoon, and implement it in Pixi (as it might be easier down the line to add sprites, use masking, shaders, etc).

 

The code isn't documented at all really and is questionably structured (using browserify modules), but I basically just followed this tutorial while refactoring for convenience along the way, and adapted some bits for Pixi. I'm hoping to improve it further and document it properly, but I think it works quite well for a couple of hours' work.

 

Anyway, here's the demo and here's the code. Arrow keys to move/turn, space to 'fire' (though all that does it play the firing animation ). I've not tested it anywhere other than my laptop in Chrome, so let me know if it runs badly/breaks - it doesn't seem to like Safari, and I've not tried it on mobile at all. If it does run badly, this is a relatively high resolution (800x450) - you can set the resolution in the 'config.js' file, and the FOV is controlled by the 'plane.x' property in camera.js. It runs smoothly in Chrome even at 1920x1080 - though the skybox breaks as it was a last minute addition

 

(should note - textures are ripped from wolfenstein and the skybox is taken from the original demo above)

[FJGuerrero]

Thanks to share it! I find it really interesting. 

[kuuuurija]

looks great!! Thanks for sharing!!