Decal on first frame

[NYCdotNet]

I am trying to draw a decal on the flat side of a Cylinder and running into frustration in a few areas.

 

For the sake of discussion, let's say I'm making a Chess game where all the pieces are cylinders.  I want to label the flat side of the cylinders with an image to represent the piece it is (king.png, queen.png, etc.)

 

I based all of my code on the cat decal demo here: http://www.babylonjs-playground.com/#1BAPRM

 

As a proof of concept, I made a white cylinder floating in space and when you click on it, it gets a decal drawn on it (since there's not a Chess image, the "tree" will do). http://babylonjs-playground.com/#UPYIP#10 This works as expected; when you click the piece, the tree decal appears in the center of it.

 

Now I want to draw the decal automatically without requiring a click, so I commented out all of the click event stuff, and just moved the two lines that set up the decal into the main function.

http://babylonjs-playground.com/#UPYIP#11 

 

There are two odd things with this revised demo.

 

First is that the decal is not applied to the object in the same way as it is in response to the click event.  It seems to be oriented wrong (perpendicular to the cylinder) and is not scaled as I would expect and possibly cropped?  The second is that there's a noticeable delay from the first render of the cylinder to the appearance of the decal.

 

Any assistance to get this decal drawing correctly on the first frame would be greatly appreciated.

 

Thanks!  Babylon is awesome!!!

[aWeirdo]

Hi @NYCdotNet 
Welcome to BabylonJs!
The simple answer is that the scene isn't ready when it tries to add a decal

http://babylonjs-playground.com/#UPYIP#12

[NYCdotNet]

Hi @aWeirdo,

Thank you so much for this answer.  I suspected it was something like that.  I appreciate the help.  I am able to get my piece rendering with the decal I want now.  I'll update the docs for the CreateDecal method to ensure people are aware they have to wait for the scene to be ready to apply a decal.

I have a follow-up question, though.

Is there any way to eliminate the delay of the decal being applied?  Or is this the scene ready?  If it is scene ready, why isn't the scene ready before the first frame is rendered?  I think I can work around this by setting the mesh to visible=false and then setting visible=true once the decal is applied, but I'd prefer a better solution if one's available since this will make the "decal" pieces appear later than the non-decal ones.

Thanks so much!!

 

[jerome]

Every time you declare an external asset, it takes time to be downloaded asynchronously by the browser, then to be computed and passed to the GPU as a texture (quite very fast).  Meanwhile the rest of your script is still executed, so the first call to requestAnimationFrame() (aka first frame).

Unless you use the AssetManager and dowload everything before starting to run the render loop, this is the browser expected behaivour : unpredictable download time.

[NYCdotNet]

Thank you.