Rotate sprite axis Y

[Koroldev]

Hello guys, I am using the sprite for a shot from a gun effect. How I can rotate Y axis of a sprite? I need somthing like on screenshot.

My sprite:

It screen I did in the photoshop to give an opportunity to understand what I need

[aWeirdo]

Hi @negrant 

You should use a basic plane mesh instead, with a BILLBOARD mode, not 100% sure which one will work out best

[Koroldev]

5 minutes ago, aWeirdo said:

Hi @negrant 

You should use a basic plane mesh instead, with a BILLBOARD mode, not 100% sure which one will work out best

But babylon does support the animation of textures? I need an animated effect. Thank!

[GameMonetize]

For sure we support animation of textures  (at least for uv and w coordinates)

 

sprites are purely 2d objects so you cannot get what you are looking for.

 

But with a simple plane with a texture you can start rendering what you want. You can then use a simple timeout to either change the texture or just play with uoffset and voffset for instance

[Wingnut]

Hi guys.

Negrant, here is a rather messy playground that uses our new Canvas2D system (WorldSpaceCanvas2D method, with Sprite2D primitive)... to place and parent a Sprite2D primitive (with sprite atlas animation) onto a box.  It works pretty well.  Just change the box to a plane, for your needs.

When deltakosh mentions offsets, he is talking about moving-around the large sprite atlas image (textures/player.png) in such a way... as to cause animation.  The texture is being remapped-onto the mesh... very quickly... sliding around.  "Offsetting".    uOffset and vOffset are properties found on BJS Texture Class .  

Although sprite-like animation CAN be done fine upon a BJS mesh, offsetting textures for a standardMaterial... the Canvas2D system does it differently.  Sprite2D is not a standard BJS sprite or mesh, nor does it use a standardMaterial.  The offsetting is done in lines 31-50 of the above demo.

I don't know if the Canvas2D system will seem overwhelming/difficult for you.  I hope not.  Let's go a bit further, and see if you hate me afterwards.

In lines 1-53 is the large spacecase() function.  It does everything needed.... to activate a worldSpaceCanvas2D (wsc2d)... and it returns that wsc2d... when spacecase() is called at line 79 of the "mainline" createScene code.  WorldSpaceCanvas2D places its graphics on a "node"... which is essentially an invisible box mesh (sometimes called a trackedNode).  It does this so the wsc2d can be placed within the scene worldspace... and act like a standard BJS mesh.

In line 80, I "harvest" a reference to that invisible 'node' (mesh).  (I get the worldSpaceCanvasNode.)  Then I parent that node to the box, and set its position very precisely, and scale it down to be the same size as the box.  (lines 81-83).  Line 84 just displays the node's bounding box.  It works good for a simple border, in this case.

For fun, change line 82... from -10.1... to -20.1   You will see the Canvas2d-based worldSPaceCanvas2D node... be separated from the box.  By using this method, we have not changed the green StandardMaterial on the box (created in lines 73-74)  The box still has FULL material powers, right?  Handy!  It is... as-if your sprite is animating on a piece of glass, eh?  http://www.babylonjs-playground.com/#20MSFF#52

Hope this helps.

[Koroldev]

Wingnut, thank, very good example - that's what I need! I will try do somthing with this

[Koroldev]

Wingnut, I have a one more questions about  worldSPaceCanvas2D, what about performance? If my scene will have 50-100 or even more such Convas2d sprites? It is very critical or it is normal?

And if I will use this method for simulate the bullet holes or traces after the bang? It will be right or for this purpose uses somthing different? Thank!

[Wingnut]

Hi again, N.  Those are good questions... and difficult to answer.  We have a very cool system called the Solid Particle System... or SPS for short.  Do some forum searches, docs searches, and view some playgrounds... about SPS. 

SPS has the abilities to make some VERY lightweight "planes"... which can easily be textured and positioned.  It would be using the same method that Deltakosh mentioned... but in a "5000 of them - no problem" -way.  I am talking about bullet holes here, NOT muzzle flash.

My suggestion is to NOT use Canvas2D and Sprite2D for your bullet hole purpose.  Use SPS, or just plain planes, as Deltakosh suggests.

Plus, you can easily change it later.  Just change your spriteGenerator() function.  Or do it BOTH ways, and compare the features and performance - gain the experience of working with BOTH systems.  (and have a fun time doing it).  

For muzzle flash/blast... I would use a STANDARD BabylonJS particle system.  Recently, I "stumbled-across" a playground demo that someone had made... to simulate smoke.  I think it is marvelous, and could easily be converted to muzzle flash/blast.  http://www.babylonjs-playground.com/#1DZUBR#24  This playground uses multiple particleSystems at the same time.  Possibly overlay a third BJS particle system... for the fire part. 

Keep in mind that MANY BJS particleSystems can share the same particle-emitter location.  It can be a mesh (invisible allowed), or JUST a point in space.  Our particle systems have a .manualEmitCount property that is designed for short blasts of particles... perfect for your needs.  When you set a .manualEmitCount on our particle systems, the .emitRate is ignored.  The particleSystem sprays ALL of its particles, as fast as it can, and then stops... just what you want.  Cool, huh?  Here is a PG demo of a particleSystem with a .manualEmitCount.  http://www.babylonjs-playground.com/#15UMON#9

I think you'll find... that no matter WHAT you try, BJS will not let you down.  WebGL might disappoint you, Javascript might disappoint you... but BabylonJS has not ever been a roadblock in anything I have EVER tried to do with it.  Mostly, my own brain was the logjam.  A lack of research into the things I was trying.   Be well, party-on.

[Raggar]

http://www.babylonjs-playground.com/#15UMON#10

Does make for a pretty cool muzzle flash effect. I'm not too keen on the big, apparent particles in the middle, but other than that, it's cooler and more dynamic than using sprites.