solved Solid Partice System UpdateParticle Typescript

[DylanD]

Hi, I am trying to set up falling particles and I am using typescript.

So far I have been able to create particles but no make them fall.

Code to make particles:

var myPositionFunction=(particle, i, s)=>{
         
         
            particle.position.x = (Math.random() - 0.5);
            particle.position.y = (Math.random() - 0.5);
            particle.rotation.y = Math.random() * 3.5;
            particle.position.y += 0.1;
            particle.checkCollisions = true;
            this.SPS.updateParticle(particle);
        };
        this.SPS = new BABYLON.SolidParticleSystem("sps",this.scene,{updatable:true});
        var model = BABYLON.MeshBuilder.CreateBox("m",{width:0.03,height:0.03,depth:0.03}, this.scene);
        this.SPS.addShape(model,100,{positionFunction: myPositionFunction});
        var mesh = this.SPS.buildMesh();
        model.dispose();
        this.SPS.updateParticle = function(){

        }

Whenever I try to make the this.SPS.update function it gives me this error

Type '() => void' is not assignable to type '(particle: SolidParticle) => SolidParticle'.
[TSC]   Type 'void' is not assignable to type 'SolidParticle'.

 

They only way I've been able to get that error to go away is if I put it in the myPositionFunction and put particle as one of its parameters. 

I also can't find much on using Solid particle systems in typescript at all.

Any ideas on how to fix this ?

[Guest]

Pinging @jerome

[jerome]

doc : http://doc.babylonjs.com/how_to/solid_particle_system

not sure to understand exactly what you mean ...

I don't understand something in your code : why do you call SPS.updateParticle() within the positionFunction ?

the function updateParticles() that you define is called for you by sps.setParticles().

When you use some positionFunction(), this one is called at construction by SPS.buildMesh(). No need for calling updateParticles() then (especially if this later is not defined yet when buildMesh is called like it looked to be in your snippet, not sure).

[DylanD]

4 hours ago, jerome said:

doc : http://doc.babylonjs.com/how_to/solid_particle_system

not sure to understand exactly what you mean ...

I don't understand something in your code : why do you call SPS.updateParticle() within the positionFunction ?

the function updateParticles() that you define is called for you by sps.setParticles().

When you use some positionFunction(), this one is called at construction by SPS.buildMesh(). No need for calling updateParticles() then (especially if this later is not defined yet when buildMesh is called like it looked to be in your snippet, not sure).

In this PG the update makes it rotate, I want my update function to be similar,  however affect the position.  

When I copy paste that function into my code, I get an error on this line(79 of the PG), this error:

Type '(particle: any) => void' is not assignable to type '(particle: SolidParticle) => SolidParticle'.
[TSC]   Type 'void' is not assignable to type 'SolidParticle'.

 

The updateParticle in my other example code was not needed or used.

So my problem seems to be some kind of typing error because of typescript with the solid particle system update particle function.

 

 

Heres PG that I made, that shows what I'm trying to do.  But when I put that same code into typescript I get an error on line 55(See the above error).

Any ideas how I can get around this?

 

 

 

[jerome]

OK, I guess I understand a bit better :  actually you have a type error in your code in TS. This error would come from some wrong signature declaration in the BJS TS code.

As I can't reproduce your code here and as I can't see the error stack to get the culprit line, maybe could you copy/paste this stack here or tell us what function call (or declaration) causes the issue ? and tell us also if it happens at compilation time (what I suppose) or at execution time.

Meanwhile, please have a look at this (maybe it's your problem): https://github.com/BabylonJS/Babylon.js/blob/master/src/Particles/babylon.solidParticleSystem.ts#L1284

In TS ,the default function updateParticle() is expected to get 1 SolidParticle  and to return this passed particle. JS is more gentle and tolerates that you change this behavior by NOT returning anything, like it's done in the PG examples so far. So just check that your custom updateParticle() function rightly returns the passed particle in TS.

[DylanD]

26 minutes ago, jerome said:

OK, I guess I understand a bit better :  actually you have a type error in your code in TS. This error would come from some wrong signature declaration in the BJS TS code.

As I can't reproduce your code here and as I can't see the error stack to get the culprit line, maybe could you copy/paste this stack here or tell us what function call (or declaration) causes the issue ? and tell us also if it happens at compilation time (what I suppose) or at execution time.

Meanwhile, please have a look at this (maybe it's your problem): https://github.com/BabylonJS/Babylon.js/blob/master/src/Particles/babylon.solidParticleSystem.ts#L1284

In TS ,the default function updateParticle() is expected to get 1 SolidParticle  and to return this passed particle. JS is more gentle and tolerates that you change this behavior by NOT returning anything, like it's done in the PG examples so far. So just check that your custom updateParticle() function rightly returns the passed particle in TS.

Adding the return to the end of my function fixed the problem.  Thank you very much!

Final Code:

var myPositionFunction=(particle, i, s)=>{
         
         
            
            particle.rotation.y = Math.random() * 3.5;
            particle.position.y += 0.1;
            particle.checkCollisions = true;
            
        };
        this.SPS = new BABYLON.SolidParticleSystem("sps",this.scene,{updatable:true});
        var model = BABYLON.MeshBuilder.CreateBox("m",{width:0.03,height:0.03,depth:0.03}, this.scene);
        this.SPS.addShape(model,100,{positionFunction: myPositionFunction});
        var mesh = this.SPS.buildMesh();
        model.dispose();
       this.SPS.updateParticle=(particle)=>{
           particle.position.x +=this.xVel;
        
            return particle;
       }

update=()=>{
   this.SPS.setParticles();
}

 

[jerome]

you're welcome

more generally, don't rely only on the PG example code in JS when coding in TS, keep in mind to check the method signatures. I think tools like VSCode display the right signature within some pop-up while you're writting the function call in your program.

[DylanD]

16 minutes ago, jerome said:

you're welcome

more generally, don't rely only on the PG example code in JS when coding in TS, keep in mind to check the method signatures. I think tools like VSCode display the right signature within some pop-up while you're writting the function call in your program.

Yea, VsCode does do that, I guess I just didn't make sense of it.  Il definitely try it more.  

I'm still pretty new to TS so I still have a lot to learn.