Search the Community

The RevoltFX effects framework now runs with the latest PixiJS version (8.1.0). https://github.com/bma73/revolt-fx We've also updated the examples https://github.com/bma73/revolt-fx-examples See a live demo: https://samples.revoltfx.electronauts.net/ To create your own effects use the RevoltFX online editor https://editor.revoltfx.electronauts.net/ https://github.com/bma73/revolt-fx-editor Stay tuned - there's more to come :-)

I could replicate this issue in this CodePen https://codepen.io/mariogarranz/pen/Yzqjboj In this example I create one ParticleEmitterManager and it into a Container that had its scale modified. Then I add 3 ParticleEmitters to this ParticleEmitterManager, all of them with the exact same settings, but everytime a new ParticleEmitter is added, some offset is added to its positioning and scaling, so in the end you can see all 3 of them in different spots and scales. This seems like a bug to me, but maybe I got something wrong? My game uses a container with a scale for the board of the game and it's being impossible to have the particles display properly over it, unless I use 1 ParticleEmitterManager for each ParticleEmitter, which seems too overkill.

Hi everyone, so i have a question about how i can make my particles emitter to move from point to point and is it possible to do this. I have an exact example of what i need. Can someone give me a simple code example ? Thanks.

We have just released RevoltFX - a framework to create stunning particle effects. You can create particle emitters and time based effect sequences and nest them all together. Check out some samples https://samples.revoltfx.electronauts.net/ Get the library on Github https://github.com/bma73/revolt-fx To create your own effects use the RevoltFX online editor https://editor.revoltfx.electronauts.net/ Get the editor on Github https://github.com/bma73/revolt-fx-editor

Hi all, We are drawing ~10k interactive sprite circles. We are grouping them in separate PIXI.Containers (sectors). Inside those we do another grouping, this time we use particleContainers to speed up with sprites inside. The problem is - when I try to calculate local bounds of sector container which is certainly filled with particle containers and with sprites - it returns width = 1, height = 1. Can it be the case because of particleContainers? Thanks!

Hi all, was just having a play with an effect for an explosion, and thought it would be cool to trial out some fireball style effects with some sort of simulated gravity. eg. 4 or 5 fireballs, with smoke trails behind.. Had a play but noticed that pixi particles doesn't really offer anything in terms of subemitters, unless I've missed it? So really been trying to find a workaround. I'm not so hot when it comes to the maths of any gravity, so have used gsaps 2dphysics plugin to get it working https://greensock.com/docs/Plugins/Physics2DPlugin... so each fireball itself is a sprite in a container, then onupdate with that animation, the x&y position of the fireball is sent to update the ownerposition of the trail emitter. It does work pretty well appearance wise, but performance does feel like it takes a bit of a hit, which Im guessing maybe down to the plugin. Any ideas on any more "optimal" ways in which something like this could be achieved?

I’m trying to optimize my babylon scenes using GPU particles, but If I use the same blend mode as I had with standard particles (BLENDMODE_MULTIPLYADD), then my particles look terrible with the transparent portion being ignored. If I use BLENDMODE_STANDARD the particles come out looking too dark. Is there a way to have the same look when I’m using both GPU particles and non-GPU particles? Here’s a playground with my settings and using my particle texture. https://www.babylonjs-playground.com/indexStable.html#C1KYFM#2 Thanks!

I am trying to make a snow effect on the main menu using the particle emitter but particles spawn way to fast. I have this code: var particles = this.add.particles('snow'); var emitter = particles.createEmitter({ speedY: { min: 15, max: 40 }, gravityY: 0, scale: 0.2, quantity: 1, lifespan: { min: 28000, max: 30000 }, emitZone: { source: new Phaser.Geom.Line(-20, -100, 820, -100 )} }); And quantity is only one, so I do not know how to fix this.

Hi guys, I'm trying to add Phaser particle system plugin to my starter project. I've bought the ParticleStorm yesterday and thought it would be practically self explanatory to add it to the project. But it was not that way I really hope you have any idea or could give me any tips, how can I come closer to the solution. It seems that I really lack knowledge about Webpack + Npm/node modules Let's start at the beginning. I bought the system, and got a package which seems like a module, so I've copied the complete project folder inside my node_modules folder. I've tried to manually install the package npm install -g phaser-particle-storm or npm install -g ./phaser-particle-storm, but I get "Could not install from "phaser-particle-storm" as it does not contain a package.json file. (ERR ENOLOCAL)". I moved further, thinking maybe I do not need to install it, so I've added path to particlestorm.d.ts into tsconfig.json. And then I've tried to add the module to Phaser.Game.PluginsManager like this: this.manager = this.game.plugins.add(Phaser.ParticleStorm);. And because phaser.d.ts has this line of the code at the beginning of the file declare module "phaser-ce" { export = Phaser; }, I think that it wants to look after the ParticleStorm inside phaser-ce.js or even phaser-split.js (do you know maybe whats with that split variant? ). My next try was then to add something similar to the particlestorm.d.ts, like declare module "phaser-particle-storm" { export = Phaser.ParticleStorm; }, and then in my class I have an import statement import * as PStorm from 'phaser-particle-storm';, but then I get a complain, that it can not find the module. Adding particlesstorm.js and particlestorm.d.ts scripts inside my project did not result in any success. I would like that the plugin would be part of the project like Phaser game engine is. I have no clue in which direction do I need to go from here. Obviously I'm missing something.

Hello! I've been dabbling in Babylon for a month or so now, and things are going well, but I'm getting caught up on this one problem: I have several avatars in a row. They all have jetpacks, but there should only be one active any time. I've parented the emitter fountain objects to each of the avatar's hip bones and then offset it so that it's behind the avatar roughly in the location of the jetpack on the mesh. It works fine for the avatar at (0,0) but the fountain doesn't seem to move when i translate each of the avatars into their final positions Isn't that what parenting does? It does rotate gently as my avatar moves in it's idle animation, so I know it's attached. Even if I don't set the position of the fountain, it still doesn't move along the x axis when my avatar does. I've tried to approximate my scene using the playground here: https://www.babylonjs-playground.com/#424Q55#2 The Rabbits are structurally a bit different from my meshes in terms of skeleton and my avatar's have no submeshes like the Rabbit does. You can see that although there are 6 different emitters, they're all at the same place. I've turned on the visiblity of the fountain so you can see it if you rotate the scene behind the avatars. A related problem I'm having (even when the avatar is at 0,0) is that when i rotate an avatar and animate it, the emitter follows the path of the avatar as if it wasn't rotate at all. Am I parenting incorrectly or missing a step? I know setting position changes the world position, but it seems like with the parenting, the x position should still change as the parent does. Thanks for any help you can provide!

Hello! I'm trying to do simple explosion with emitter. I want particles to slowly fade out so I do: emitter.setAlpha(0.2, 1, 10, Phaser.Easing.Linear.None, false); emitter.autoAlpha = true; But when i run game and emitter start doing it's job it throws at the console: Uncaught TypeError: Cannot read property 'v' of undefined at Phaser.Particle.update (phaser_phaser_1.js:99052) at Phaser.Particles.Arcade.Emitter.update (phaser_phaser_1.js:99548) at Phaser.World.Phaser.Group.update (phaser_phaser_1.js:33716) at Phaser.Stage.update (phaser_phaser_1.js:31820) at Phaser.Game.updateLogic (phaser_phaser_1.js:36338) at Phaser.Game.update (phaser_phaser_1.js:36280) at Phaser.RequestAnimationFrame.updateRAF (phaser_phaser_1.js:61979) at _onLoop (phaser_phaser_1.js:61962) What am I doing wrong with this task? Edit: Solved - it seems like I set too low alpha rate parameter (third param. in setAlpha). I misunderstood how it works. Now I get it. If I set rate as 1500 ms particles will fade out in this time. It works now.

Hello! I've created a tilemap layer this way: layer = map.createStaticLayer('ground', tiles, 0, 0).setDepth(1); After that added a particles emitter this way: particl = scene.add.particles('imagename').createEmitter({ lifespan: 300, alpha: { start: 1, end: 0 }, on: false }); Although the emitter is created after the layer - in the application particles are behind the layer's tiles, so partly not visible. How do I set the depth of the emitter to make it always visible? Any other way to bring it in front of the layer is also good. Thanks!

We are in the process of porting our Phaser-CE game to Phaser 3 and have been using Particle Storm. We were able to make a lot of great particle effects with this and it looked like the Phaser 3 particle system was fairly similar. However, we are finding some serious limitations that render the vast majority of our particle effects impossible in Phaser 3. I'm hoping this isn't actually the case and I'm just overlooking something. For example, a lot of our particles start with a random alpha value, fade in from 0 to full opacity at the half point and then back to 0 at the end: alpha { value: {min: 0.5, max: 1}, control: [{x: 0, y: 0}, {x: 0.5, y: 1}, {x: 1, y: 0}], } However, two issues in Phaser 3: 1. You can't use min/max in addition to start/end, so it is an either/or with having random values and values that tween. 2. You can no longer define a control, you can only provide an easing function, which means you can only either fade in or fade out, but not both. Is there any way to accomplish this in Phaser 3 that I'm overlooking?

Hi everybody, I'm trying to create a ship wake effect similar to the one below. I'm using a particle texture but am having difficulty aligning the texture properly. I've turned off billboard based particles, so that it would not face the camera. But, it current is aligned in the direction that the particles are being emitted. I'd like to rotate it 90 degrees along the y-axis but can't figure out how. Any suggestions?

Hi, had issue that I needed mesh A to be in front of particles, and particles in front of mesh B but all 3 should be behind rest of scene meshes. (Tried to make PG) To achieve it I used renderGroupId but as default one is 0, I set `RenderingManager.MIN_RENDERINGGROUPS = -2` and for mesh `A.renderingGroupId = -2` and for particles `particles.renderingGroupId = -1`. Works well in all browsers but in android webview particles are in front of some meshes (transparent pbr material) and some meshes disappeared that are in front of particles (near to them). I am doing something wrong, or maybe there is better way to achieve this ? Thank you

ANSWERED Hi, By updating the phaser 2.x version I stumbled upon >all particles are broken<. this is the extended Phaser.Particles.Arcade.Emitter class: as line7>> "this.start(false <- should revive a particle at the emitters position after "lifetime". it just doesn't do anything. All particles are done once, and they do not repeat themselves anymore. Was there a breaking change I did not get? note: The v2.7.x gravity change is not the case here constructor (config: any, amount: number = 10) { super (config.game, config.x, config.y, amount); config.level.layers.effects.add(this); this.setYSpeed(-20, -200); this.setXSpeed(-5, 5); this.makeParticles('assets', 52); this.start(false, 100, 150, amount); //this should revive particles after lifespan(2), but doesn't console.log(this.children); } Any thoughts? regards

PG: https://www.babylonjs-playground.com/indexStable.html#PU4WYI#33 I tried set the `color1` or change the texture pic but it seems that the particleSystem just made black paricles transparent.

Hi everyone ! I've seen that a particleSystem as an emitter attribute, where the particles come from. However I didn't see anything about a "receiver" attribute, in order not only to emit particles from one point but to really create a stream of particles between 2 points. I know I can kind of simulate that with the direction of the particles, their speed, their lifetime, etc... but the point here is to have a simple way to change emitters and receivers so we can create stream between 2 objects on demand. Is there a way to do so ? Big thanks !

Hi, guys. NeutrinoParticles plugin for PIXI is tested and released. You can download the Editor and check out video tutorials, samples and live demos at https://neutrinoparticles.com/ It is the best particle editor for PIXI. Isn't it?

Should it be possible to create emitters in a loop and then add them to a group? I'm trying to use particle emitters as explosions and I might need to fire off multiple at a time. I figured I would use basically the same strategy used with bullets. Maybe there is a better strategy? this.explosions = this.add.group(); let particles; let emitter; for(let i=0; i<3; i++) { particles = this.add.particles('spark'); emitter = particles.createEmitter(); emitter.setSpeed(200); emitter.setBlendMode(Phaser.BlendModes.ADD); emitter.on = false; this.explosions.add(emitter); //this line causes an error. }

I'm playing around with the particle system, trying to create subtle background particles wafting randomly around. I think i have something (https://www.babylonjs-playground.com/#WJBZQH), but I'd like to fade in particles - not just out. Particles suddenly appearing is a little jarring. Is that even possible? I know a "soft birth" of particles has been mention here before, but I couldn't really make much sense of it as is also tried to do alot more. Also: how can i use particles with a transparent scene clearColor? With that, particles are simply not visible until they appear over some geometry in the scene. Any tips?

Hi I am building a new game for facebook Instant games and they ask for a lightweight game that doesn't use hardware acceleration. Does the particles().createEmitter() uses some sort of hardware acceleration? Usually its a yes when we talk about particles systems, but on the website it says its lightweight so I was wondering. Thank you!

The playground http://www.babylonjs-playground.com/#CGSXR from http://doc.babylonjs.com/samples/grid_moves runs at 10fps on my Razor Blade laptop with nVidia GTX 1060. Is that normal?

Hi Folks, Here's a SPS new feature : the particle parenting. Simple to understand : once a particle has a parent, all its rotation, position and pivot are then expressed in the parent particle local space. Simple to use : sps.initParticles = function() { for (var i = 1; i < sps.nbParticles; i++) { // declare each previous particle as the parent of the current one sps.particles[i].parentId = i - 1; } }; sps.updateParticle = function(p) { // each particle will rotate for +0.001 in the already rotated parent space particle.rotation.z += 0.001; } examples : the green box is parented to the translating red one, it also rotates around a local pivot http://jerome.bousquie.fr/BJS/test/spsParenting.html 600 boxes, parented per groups (stems) of 10, each rotating around its pivot : http://jerome.bousquie.fr/BJS/test/spsParenting2.html

I'm interested in the Particle Storm plugin, but I'll be updating my game to Phaser 3.0 shortly. WIll the plugin be updated for 3.0, or will the code work in 3.0?