Using Bitmap data as particles

[kevinAlbs]

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.

[rich]

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

[kevinAlbs]

Awesome, thank you. I should have looked more into the examples.