sprite manager texture

[jerome]

http://doc.babylonjs.com/page.php?p=24768

 

As described in the documentation, the SpriteManager is construted with an imgURL.

 

Is there a way to affect a texture (or a dynamicTexture) or a preloaded image or dataURI instead ?

 

I would like to create dynamic textured sprites because they are ever facing the screen rather than transparent dynamic textured planes (rotating with the cam) as I did here for X, Y and Z characters : http://www.babylonjs-playground.com/#2EE9UD#4

[julien-moreau]

Hum,

 

According to the sources (https://github.com/BabylonJS/Babylon.js/blob/master/Babylon/Sprites/babylon.spriteManager.js), it looks like it is not possible

But, something you can do for the moment is :

var sm = new BABYLON.SpriteManager(name, '', capacity, cellSize, scene, epsilon);sm._spriteTexture = myTexturesm._spriteTexture.wrapU = BABYLON.Texture.CLAMP_ADDRESSMODE;sm._spriteTexture.wrapV = BABYLON.Texture.CLAMP_ADDRESSMODE;

Don't forget that you can pass a buffer (DataURL or ArrayBuffer) to a new Texture using :

var t = new BABYLON.Texture('data:my_image_name', scene, noMipmap, invertY, samplingMode, onLoad, onError, buffer, deleteBuffer);

- name: begins with 'data:' to precise that you want to use the buffer to generate your texture

- buffer can be your base64 string from a canvas.toDataURL() or an array buffer

- deleteBuffer, means if you want to delete the buffer after loading the texture or keep it for cloning.

[jerome]

Cool !

 

Maybe in future versions, wouldn't it be nice to decouple every http-loading tasks (assets, etc) from visual object creation, tough it will break some function signatures ?

 

This would ease to manage web resource access regarding SOP , CORS, etc and allow the developer to deal with texture, images, etc  before setting them to a visual object (mesh, sprite, ...)

[julien-moreau]

Yeah, it's a good idea

For the SpriteManager something useful can be a mySprite.setTexture(texture); or mySprite.setNewTexture(texture); that you can call after creating the SpriteManager by passing an empty string for the texture to the constructor.

Just, I didn't check other objects that work like it, so I don't know if it's possible for other objects ^^

 

For the moment, maybe you can create a PR on the Github. Deltakosh will determine if it's useful or not for BabylonJS. Then, you can have a simplified way for your project using the official BabylonJS build

Before creating your PR, take care of how SpriteManager is working, because maybe a setTexture(); isn't enough.

[joshcamas]

Yeash I agree completely with having such things, for both sprites and meshes! Imagine having a system that detects when a mesh uses the same image as an already-loaded mesh. Huzzah!

[jerome]

@Luaacco :

I tested your tip  here : http://www.babylonjs-playground.com/#1GWIGC

 

I wanted to create a text sprite from a dynamicTexture.

makeTextSprite() and makeTextPlane() are very similar, but the first one sets the dynamicTexture to the sprite texture and the second one sets the dynamicTexture to the plane material diffuseTexture.

 

Only the textured planed seems to display. I just can't see the textured sprite (and no error log).

Any idea ?

[julien-moreau]

Hey,

 

I searched and I don't know the reason we cannot see the text

The trick is working for sure (you can check : http://www.babylonjs-playground.com/#1GWIGC#1 )

Also, your sprite exists (you can change the clear color from "white" to "black").

I'm not enough familiar with sprites, I hope someone else will help you

[jerome]

thank you for having checked

 

I changed the sprite background color to blue : http://www.babylonjs-playground.com/#1GWIGC#2

The sprite is here, not that big and with no texture :-(

 

ooops, couldn't see your example because of the ")" at the end of the link

I've just discovered it, with the palm tree

 

maybe a dynamicTexture can't be set as a Texture to spriteManager._spriteTexture

don't know

 

need to dig 

[GameMonetize]

This works for me. I can see a blue sprite with some texts inside

[julien-moreau]

You should work with power-of-2 sizes for your dynamic texture : http://www.babylonjs-playground.com/#1GWIGC#3
Also, according to the WebGL documentation, non power-of-2 textures support is limited : https://www.khronos.org/webgl/wiki/WebGL_and_OpenGL_Differences

[jerome]

Waooww....

I wouldn't even think about that openGL sutff

thank you so much as I was starting to pull my hair out !

 

So what does this openGL support depends on  on my platform : browser version ? driver ? video card firmware ? (I use a Nvidia Quadro K620 with linux nvidia331 driver on a Ubuntu 14.04 64bits), just for my curiosity

 

BTW, do you know why the sprite isn't bigger when I want it sized 4096px instead of 512px (line 40) ? http://www.babylonjs-playground.com/#1GWIGC#5

 

[EDIT]

Ok, I think I understand :

http://doc.babylonjs.com/page.php?p=24768

 

The cellSize is the size of the square to cut into the texture in order to have to different sprites from the same texture.

It doesn't resize/scale the original texture.  That's not the sprite size even if there's only one cell.

So wanting only one sprite (one cell) from my texture, I need to pass a cellSize equals to my original texture size to the spriteManager.

Then I can resize the related sprite with sprite.size

 

http://www.babylonjs-playground.com/#1GWIGC#6

 

here you have thus two text dynamicTextures, one attached to a plane mesh (rotating according to the cam position), the other to a sprite (ever facing the screen)

 

thank you again guys for your explanations !

[jacquesr]

Hey guys, this is an old topic, so I was wondering if there is a better solution meanwhile. The solution proposed here accesses private members of the spriteManager and I usually feel very uncomfortable with such workarounds since changes to non-public code may not be included in breaking changes lists

[GameMonetize]

babylonjs 2.4 introduced the texture accessor:

http://www.babylonjs-playground.com/#1GWIGC#8

(You may need to clean your cache)