Dynamic text on blender object

[Kendy]

Hello Masters,

Need help to add 2-d text from babylon on the object which is blender object.The text should not be go outside of the rendered object.

Can you please help me to short out this issue? It would be great if anyone have the example.

[Temechon]

Hi, 

Did you try canvas2d ? Example here : http://babylonjs-playground.com/#EPFQG#4 and documentation here: http://doc.babylonjs.com/overviews/canvas2d_home

[Kendy]

Thanks Temechon for the quick reply.

That help me a lot to understand 2d texture. Now the question is I am having imported meshes and I need to print text on it. Let say I am having a skull like below example and I need to print my name on the skull's forehead like attached screen. How can I achieve it?

http://babylonjs-playground.com/#GF9PW

[Wingnut]

Hi @Kendy, welcome.  I got interrupted (time to do some snow blowing)... but... http://babylonjs-playground.com/#GF9PW#2

Here I am experimenting with clicking on the skull's forehead to place a BabylonJS "decal" object there.

I am attempting to use a dynamicTexture as its .diffuseTexture... and then calling the dynamicTexture.drawText() method... with some text... and then calling the dynamicTexture.update function (all in the onPointerDown handler).

I'll come visit and experiment more... after I get my chores done.  Meantime, you can goof around and try to get the "label" to be something other-than black on black.

Click on the skull's forehead.  The decal is there, but the dynamicTexture is not doing so well, yet.  Maybe others will help, too.  Do some edits, make some more saves, good luck.  I have never tried using a dynamicTexture as the texture for a decal.  If the playground explodes, I'm not responsible.  heh.

Warning:  I DID bog my Firefox browser quite severely with this playground... once or twice.  Never crashed... but... it went "muddy" and "thick".    BBL.

[JCPalmer]

While @Wingnut might get a post-import decal to work, he brings up the point that canvas2d is primarily designed for user interfaces.  Sounds like you wish it to exist as part of the scene, eg. if the skull moves / rotates, you want the text to do the same.

A decal is actually a mesh.  I would point out that since you are coming from Blender, you could use Blender to add the text there.  Add a text object from the Add->Text menu.  Enter the text (in edit mode), place & adjust in the scene.  Text objects DO NOT export, but you can change it to a mesh using the Object->Convert To->Mesh from Curve/Meta/Surf/Text menu.  It is now just a mesh.  You can either parent it or merge it with the "skull" mesh.

The advantage of this way is you can can place it much easier.  Short label meshes like "KENDY" are not a really significant amount of extra geometry.

[dbawel]

A Dynamic Texture is what you seek. If you need a PG scene, I can try and find a few minutes to produce one, as it's incredibly simple. But there are many examples on the BJS forum. No reason to overcomplicate - to you my good friend @Wingnut - love ya buddy!

@iicemanmade a great example...

http://www.babylonjs-playground.com/#9U086#3

DB

[Kendy]

16 hours ago, JCPalmer said:

While @Wingnut might get a post-import decal to work, he brings up the point that canvas2d is primarily designed for user interfaces.  Sounds like you wish it to exist as part of the scene, eg. if the skull moves / rotates, you want the text to do the same.

A decal is actually a mesh.  I would point out that since you are coming from Blender, you could use Blender to add the text there.  Add a text object from the Add->Text menu.  Enter the text (in edit mode), place & adjust in the scene.  Text objects DO NOT export, but you can change it to a mesh using the Object->Convert To->Mesh from Curve/Meta/Surf/Text menu.  It is now just a mesh.  You can either parent it or merge it with the "skull" mesh.

The advantage of this way is you can can place it much easier.  Short label meshes like "KENDY" are not a really significant amount of extra geometry.

That's true JCPalmer. But what if I need to change text dynamically like "KENDY" to some other text, after mesh is loaded to BJS? I think this would not help me on that.

[Kendy]

3 hours ago, dbawel said:

A Dynamic Texture is what you seek. If you need a PG scene, I can try and find a few minutes to produce one, as it's incredibly simple. But there are many examples on the BJS forum. No reason to overcomplicate - to you my good friend @Wingnut - love ya buddy!

@iicemanmade a great example...

http://www.babylonjs-playground.com/#9U086#3

DB

Basically I want to create a customise "AVATAR" for users in which avatar has its own T-Shirts and Caps and on it User can type his/her name and that name will appear on cap/t-shirt.

[Wingnut]

@dbawel - Hey... no sensual touching.    You know I'm strictly "into" farm animals during the winter months. 

I have only tried about 20 minutes more... on the dynamicTexture decals... and again failed.  I think they are working but the drawtext positioning is off-decal for some reason.

There's lots of sizes involved in dynaText decals, and there's lots of Wingnut inexperience involved, too.  I guess I can play with it some more, today.

I think the dynamic text decals would work pretty good, if we can get them working at all. 

A billboarded (always facing camera) plane, with dynamicTexture text on it... would be viewable from any angle (even when camera is behind player).  That might be wiser than the t-shirt/hat thing.... IF viewing from behind is possible in your project, Kendy.  And keep in mind that... perhaps the plane-based dynamicTexture name-label... need not be visible all the time.  Maybe it only appears when the player is moused-over... and disappears again on mouse-out.

Kendy, is there a situation where users would need to see the name of a player... from the back?  (where t-shirt and hat labels wouldn't work)

IF SO, then I would consider using JUST Text2D or dynamicTextured (with drawText) little name-planes. 

But clothing-contour-following text-mesh... would be cool, huh?  I like your idea. 

If we could make a displaceMap/heightMap... using a section of surface contour... from another already-existing mesh, then that would do it.  Just put the dynamicTexture  on the entire new displaceMap, and then position the displaceMap properly atop the clothing section that the displaceMap was MADE-from, and then we're done. 

That's all.  Easy.  heh.   Super-advanced decals.  But, how to select a surface of another mesh... to use as the data for a displaceMap... that would be rough... I think.

Ok, I'll go back to work on these dynaText decals... see if I can fig what I'm doing wrong in my pg.  (click on skull forehead to place text-unseen decal, there)

Help welcome, of course.  Perhaps dynamicTexture on decals... can't work.  Not sure.  I think I'm the first to try it... with BJS.  Expect explosions and ambulance calls.  heh

update:  http://babylonjs-playground.com/#GF9PW#5

Stuff happening!  Yay!  (I needed a little extra testing plane.  I needed to change the drawText 'color', too.  I had it as a Color3 and it needed to be string "blue".  It needed a DOM color, not a BJS color.)       Still need to click-on skull, but we have SOME text happening, now.  Cool.

[dbawel]

@Wingnut - Since I currently live on a farm, I'm with ya!

If it were me personally, I would simply unwrap the UVs in Blender, and create whatever clothing necessary for the model which appears how you want. Then simply case different materials with the same texture apsect ratio and size and switch them out as ambient or diffuse textures. Dynamic textures will work for typing text using a selection of color and font, but what I believe you're also looking for is UV unwraping of texture coordinates to fit your needs.

DB

[JCPalmer]

This topic has taken a dark tone.  I'm calling Peta.

[Kendy]

15 hours ago, Wingnut said:

@dbawel - Hey... no sensual touching.    You know I'm strictly "into" farm animals during the winter months. 

I have only tried about 20 minutes more... on the dynamicTexture decals... and again failed.  I think they are working but the drawtext positioning is off-decal for some reason.

There's lots of sizes involved in dynaText decals, and there's lots of Wingnut inexperience involved, too.  I guess I can play with it some more, today.

I think the dynamic text decals would work pretty good, if we can get them working at all. 

A billboarded (always facing camera) plane, with dynamicTexture text on it... would be viewable from any angle (even when camera is behind player).  That might be wiser than the t-shirt/hat thing.... IF viewing from behind is possible in your project, Kendy.  And keep in mind that... perhaps the plane-based dynamicTexture name-label... need not be visible all the time.  Maybe it only appears when the player is moused-over... and disappears again on mouse-out.

Kendy, is there a situation where users would need to see the name of a player... from the back?  (where t-shirt and hat labels wouldn't work)

IF SO, then I would consider using JUST Text2D or dynamicTextured (with drawText) little name-planes. 

But clothing-contour-following text-mesh... would be cool, huh?  I like your idea. 

If we could make a displaceMap/heightMap... using a section of surface contour... from another already-existing mesh, then that would do it.  Just put the dynamicTexture  on the entire new displaceMap, and then position the displaceMap properly atop the clothing section that the displaceMap was MADE-from, and then we're done. 

That's all.  Easy.  heh.   Super-advanced decals.  But, how to select a surface of another mesh... to use as the data for a displaceMap... that would be rough... I think.

Ok, I'll go back to work on these dynaText decals... see if I can fig what I'm doing wrong in my pg.  (click on skull forehead to place text-unseen decal, there)

Help welcome, of course.  Perhaps dynamicTexture on decals... can't work.  Not sure.  I think I'm the first to try it... with BJS.  Expect explosions and ambulance calls.  heh

update:  http://babylonjs-playground.com/#GF9PW#5

Stuff happening!  Yay!  (I needed a little extra testing plane.  I needed to change the drawText 'color', too.  I had it as a Color3 and it needed to be string "blue".  It needed a DOM color, not a BJS color.)       Still need to click-on skull, but we have SOME text happening, now.  Cool.

Thank you @Wingnut for the great help. This would help me.  

As you ask me about back view, I am planning to show the text at the back side of the tee, so user can see the name always while playing game. 

 

[Kendy]

8 hours ago, dbawel said:

@Wingnut - Since I currently live on a farm, I'm with ya!

If it were me personally, I would simply unwrap the UVs in Blender, and create whatever clothing necessary for the model which appears how you want. Then simply case different materials with the same texture apsect ratio and size and switch them out as ambient or diffuse textures. Dynamic textures will work for typing text using a selection of color and font, but what I believe you're also looking for is UV unwraping of texture coordinates to fit your needs.

DB

UV mapping is always there but I was bit confuse about how dynamic textures help me to type different text on the same texture mesh. I will definitely try out the new things and will let you know if I succeed.