Jump to content

Using Bitmap data as particles


Recommended Posts

I am very new to Phaser and I wanted to try making a rain particle emitter (based off of the example: https://github.com/photonstorm/phaser-examples/blob/master/examples/particles/rain.js) but using BitmapData instead of an image.


What I found strange was that I could not refer to the bitmap data by the key. For example, my first attempt was:

  var game = new Phaser.Game(800, 400, Phaser.AUTO, '', {preload: preload, create: create, update: update});  function preload(){      var droplet = game.add.bitmapData(3,3);      var dc = droplet.ctx;      dc.fillStyle = "#7BD1E9";      dc.fillRect(0,0,3,3);      game.cache.addBitmapData("droplet", droplet);    }  function create(){      game.physics.startSystem(Phaser.Physics.ARCADE);      var em = game.add.emitter(game.world.centerX,0,200);      em.makeParticles("droplet");      em.width = game.world.width;      em.setYSpeed(700, 800);      em.setXSpeed(30, 90);      em.minRotation = 0;      em.maxRotation = 0;      em.start(false, 1000, 5, 0);    }

I though referring to they "key" was a reference to objects in the cache. Is BitmapData an exception? I noticed I could not refer to the key when trying to draw a sprite either.


I was able to get this working by changing my preload function like so:

 function preload(){      var droplet = game.add.bitmapData(3,3);      var dc = droplet.ctx;      dc.fillStyle = "#7BD1E9";      dc.fillRect(0,0,3,3);      game.load.spritesheet("droplet", droplet.canvas.toDataURL(), 3, 3);}

But I still would like to learn more about what is really going on with the keys in relation to the cache. I'm sure I'm misinterpreting something.

Link to comment
Share on other sites

Different objects are stored in separate caches. BitmapDatas are stored in their own cache, Images in their own, etc. This avoids key conflicts when for example you may wish to have an image called "player" and a sound called "player" too. The key parameter for the emitter is expecting an Image key, which is why it can't find it when you use a BitmapData key instead.


The correct way to do what you want is covered in this example here: https://github.com/photonstorm/phaser-examples/blob/master/examples/particles/particle%20class.js

Link to comment
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.
  • Create New...