Mat Groves

Pixi.js Showcase

Recommended Posts

I've been working on an ES6 pixi.js CLI tool. I looked at the current CLI tool and though it could use some improvement. So I created my own based on the `ember cli` tool. I also added support for plugins that are part of the default template. I will probably expand and document those later on. But for now here's my first go at it.


I'll will also be available in NPM soon. 

Share this post

Link to post
Share on other sites

Hi and this is my first JavaScript game / use of the canvas.


I've tried to code it in Pseudo classical pattern to maximize code reuse and make it run as well as possible.

I am sure I have made some mistakes throughout but am happy with the result and have learnt so much. I'm very grateful of PIXI and am starting to love it, already begun my next project!

 - I built this with assets from work and everything on the link is copyrighted to Universal Studios.


Thanks  :D



Share this post

Link to post
Share on other sites

Hi all - I'm new to Pixi.js but having a blast with it so far.  :D


Anyway, as an experiment, I modified this Pixi.js sample -


The following changes were made to the original code:


1) Changed the sprite

2) Added sprite scaling based on the sprite z co-ords for more realism

3) Used the painter's algorithm for hidden surface removal


Here it is on codepen:

Share this post

Link to post
Share on other sites

This one barely scratches the surface of what you can do with Pixi.js, but I thought I would show it since it's a little different. This is a spatial data visualization built upon Pixi using a leaflet map in the background. Dot density maps are used to represent spatial data and the dots seamlessly transform into chart representations using the power of Pixi.


The key here was getting all the sprites to render and animate smoothly. I was able to achieve this using a ParticleContainer and switching different containers on/off in order to switch between scenes.


There seems to be a bug in Chrome that will result in occasional stickiness. The frame-rate remains high and Chrome's own profiling tools show no issue, however the screen doesn't update for a second. Firefox and IE 11 run this as smooth as butter so I don't think there is a Pixi.js issue.


Thanks for your continued hard work on Pixi.js

Share this post

Link to post
Share on other sites

Hi Pixi team, I just wanted to say thanks for the fantastic effort behind the latest Pixi.js version. I recently upgraded from 1.6.2 to 3.0.7 and everything is running smoothly. Thanks also for xerver's help on the forums while I was upgrading.


I've also just released my game on Kongregate. Feel free to check it out if you play on Kongregate, and I'd appreciate any support :)



Share this post

Link to post
Share on other sites


'Tetris on Steroids'













ARCATRIS² is a fast-paced, colorful Tetris-like game that features a hot soundtrack and gorgeous visual effects -the perfect casual game to spend your excess time with :) It's actually my first Pixi game ever (although I've been creating games for many years). I just wanted to give it a try -and immediately liked it (besides the frustrating lag of documentation).


I think the game is quite addictive and entertaining. You can try to compete with the top 100 players (the list is quite empty yet, so it should be easy to gain a nice ranking) :) I even added a feature to record and replay games (which is used to provide the "demo mode" in the game), but I decided not to make the game record mode available to the player because it has a disadvantage: key repeat can't be used while recording (only single key presses), which is a show-stopper if you want to enjoy fast-paced gameplay. Therefore it is used to record the demo gameplay in the game (yeah, watch me play).



  • PFFF... SOME MORE... ETC...







Just let me know if you found a bug or if you are missing a funny feature. The game is quite extendable, so I'll keep extending it whenever I have the time to do so.

Share this post

Link to post
Share on other sites

I recently found pixi js and immediately fell in love with it. Currently I made just 2 projects.


Freude Quest is a game currently used as physical installation in Goethe Institut Bratislava - controlled with Leap Motion. It will be available online in december after the exhibition.


video and some reading


and a small "rope play" in the hero element on our webpage


thanks for the good work

Share this post

Link to post
Share on other sites

@Prozi great work on Chiland, looks awesome. only issue I had was that clicking to attack also moved my character, so I died, quickly and a lot.




Hmm I'll think about that


as a workaround you can upgrade your stats of health regen and power not to die so much

good luck! :)

Share this post

Link to post
Share on other sites


We used pixijs for the companion app of an interactive storybook that we're building.

We use opencv to recognise a markerless target from the book and the scene comes to life in the app where the user can interact and progress the story.

The animations and interactivity are implemented using pixi js.

You can check it out here (it's an ios app)

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.