Creatin a shotgun spread pattern (babylon.js)

Question

Hello I'm new to babylonjs and I've been trying to make a constant shotgun spread pattern in babylon.js for a couple of days.

For the moment my approach consists of having a couple of lines ready to be displayed in an array :

       let sgPellets = [
            BABYLON.Mesh.CreateLines("lines", [
                        shotgunPosition,
                        meshFound.pickedPoint
            ], this.Player.game.scene),
            BABYLON.Mesh.CreateLines("lines", [
                        shotgunPosition,
                        meshFound.pickedPoint
            ], this.Player.game.scene),
        ] 

where shotgunPosition is the absolute position of the shotgun mesh in the world and meshFound.pickedPoint is the position of where I'm aiming at (on a mesh).

So I can draw a line (the first of the array in this case) between the shotgun mesh and the mesh I click on.

Now for the second line, I want it to rotate a bit on the y axis from the first (which is exactly where I'm aiming at) so:

          for(let k=0; k<sgPellets.length; k++){
            sgPellets[k].setPivotPoint(shotgunPosition);
            sgPellets[k].isPickable = false;
            switch(k){
                case 1:
                    sgPellets[k].rotation.y += 0.1
                    break
            }
           }

It does work well when I look on the sides

but not when I look up or down.

I think I'm missing something on the math side. I've also tried using other rotation methods, for the same kind of result.

Does anyone have any hints on how to make the angle constant between the two lines ? Thank you.

Answer 1

Thank you for you're answer ! You guessed it, I am using scene.pick. I've tested you're approach and it works pretty well, I was also able to create a cone between the barrel and the point picked in the scene. But i wasn't really satisfied. Though I think you're method wouldn't work at making a consistant pattern wherever the picked point is, so I ended up doing something else. I've created a second "fake" camera which rotate and position exactly where the real one is thanks to :

fakeCamera.rotationQuaternion = BABYLON.Quaternion.RotationYawPitchRoll(camera.rotation.y, camera.rotation.x, camera.rotation.z)

This way I could add a .rotationQuaternion to the fake one with position and converted rotation from the real one (I couldn't add a quaternion for the real camera, It would messed up the controls). In the end I was able to position each rays according to the pickedPoint in the scene and the rotationQuaternion value of the fake camera.