Adding dynamic text to model

Questions
1

Hello,
I’ve been working on an apparel configurator. Can anyone give me tips on how I can allow the user to add custom text to the back of the jersey?
My plan is to add a text input box to the side. The user will then be able add their name and it will show on the back of the jersey in real time. I briefly looked into Mesh Writer but wanted to ask opinions before going any further. Below is a link to my apparel configurator’s work in progress. Below that is an example of what I would like to achieve. I’ll be ecstatic if I can get text to appear and also follow the contours of the model.

Check out my apparel configurator in the link:

This is an example of exactly how i would like the text to function:

Thank you all,
David Eustice

2

such configuration is not normally done via geometry. You simply use an html canvas object to manipulate a texture which would be the source of one of the materials channels.

3

There was recently the similar topic, maybe the answer is there - UV position problem of Dynamic Texture

4

Thank you for your responses.

I think a solution is close! I’ve pieced together a Playground:
https://playground.babylonjs.com/#VHE8SD#4

My end goal is that as the user enters text into the text input, it will appear on the boombox.glb in realtime.
I manually entered the “Hello There” text on the dynamic sand texture (line 108). I thought I could get the text input to update the “Hello There” sand text somehow by passing “input2.text” into the textureGround.drawText(); properties.
I’m a little stuck at the moment, does anyone have ideas?

I was also studying this demo where you can apply dynamic text to a 3D object in HTML5 Canvas. It’s very interesting but I don’t know if this will work in BabylonJS:
https://delphic.me.uk/tutorials/webgl-text

Thanks again!
David

5

You could fix it like this: https://playground.babylonjs.com/#VHE8SD#7

6

Genius! Thank you, I will build off of this and let you know the results.

Thank you kindly!
David

7

Here’s an update on my project.
I’ve been working on 2 ways to create the dynamic text. The first add text directly on the meshes texture.
The second is shown in the link below. The text is generated on a transparent mesh that is placed slightly above the gem:

http://www.david-eustice.com/babylon/sample_v2/index.html

1 Like