How do I control size of Particle Emitter from JavaScript?

How do I...?
1

I would like to change size of Particle Emitter from JavaScript before object is created in the scene - this is the property I’m talking about visible in GDevelop GUI:

gdevelop_particle_emitter_size
gdevelop_particle_emitter_size933×380 23.9 KB

In search of what I would have to change in the JavaScript code I adjusted the size value to something that will be easy to find in text files (32523523458), exported the project for Mobile and then recursively grepped exported files looking for 32523523458 value - it was found in www/data.js file and assigned to rendererParam1 as follows:

grep -r 32523523458

gdjs.projectData = {
...
"rendererParam1":32523523458.0,
...
};

I am able to adjust other properties of Particle Emitter from JavaScript code event as shown below - but not the actual Particle Emitter size:

const peo = runtimeScene.getObjects("NewParticlesEmitter");

peo.forEach(pe => {
    /** @type {gdjs.ParticleEmitterObject} */
    pe.setParticleSize1(500);
    pe.setParticleGravityX(300);
});

NOTE! The setParticleSize1 relates to Particle start size (in percents) in the GUI and when adjusted to above 100 it produces pixelated particle (more pixelated, larger the value is) - so adjusting setParticleSize1 is not a solution that I’m looking for!

2

I’m not at my PC. Have you looked at the documention?

I’m wondering if you need to recreate the particles or otherwise reset something after changing the size. recreateParticleSystem()
Just thinking out loud.

3

Thank you for replying @Keith_1357!

I indeed looked at the documentation and was able to figure out many other things - not this one though.

I actually spent two days not only reading documentation but also trying various permutations of multiple things I could find online and come up with myself - unfortunately I could not figure this out.

1 Like
4

I love a good challenge. I finally got to my PC. The closest I found was renderParam1

Since setParticleSize1 is a scale value. A workaround would be to set the size in the behavior screen to a large number and then scale down instead of scaling up.

image

GDevelop/particleemitterobject-pixi-renderer.ts at b1a6425ab8b456511a444cd22ca0a40d50e2adec · 4ian/GDevelop (github.com)

1 Like
5

Thanks again for looking into this and your suggestion @Keith_1357!

I tested how the downscaling looks like when particle size value is set to 160 in Particle Emitter properties in GDevelop GUI - it looks good:

gdevelop_particle_emitter_downscaled
gdevelop_particle_emitter_downscaled1017×272 33.6 KB

The downside of using downscaling method for particles is degraded performance - what is especially visible on less powerful mobile devices.

Ultimately the downscaling method is just workaround and should be used with caution - would be great to figure out a proper solution!

1 Like
6

For the curious here’s comparison to upscaling when particle size value is set to 16 in Particle Emitter properties in GDevelop GUI - it does not look good at all:

gdevelop_particle_emitter_upscaled
gdevelop_particle_emitter_upscaled1015×271 37.8 KB

7

The other option is to not do that part in JavaScript or maybe have multiple emitters preset to different sizes. Swap them as needed. IDK. I’m persistent but the more I dig into the subject, the more I learn. There should still be a JS way. We have access to all of the apps code.

8

@Keith_1357 - I already went with 10 emitters that use different size (but otherwise use exactly same configuration) and my code selects approximately most appropriately sized emitter when needed - not an ideal solution but works for time being.

If somebody who reads this at later time has some idea how to change size of Particle Emitter from JavaScript before object is created in the scene - the help would be still appreciated!

1 Like