I have added text into my object (a shirt model) using a text geometry. Here is my code:

var canvas = document.getElementById('myCanvas');

var ctx = canvas.getContext('2d');

ctx.font = 'italic 18px Arial';

ctx.textAlign = 'center';

ctx. textBaseline = 'middle';

ctx.fillStyle = 'red'; 

ctx.fillText('Your Text', 150, 50);`

My output looks like this:

The text does not fit into the shirt model. If I rotate the shirt model means text showing irrelevant view. I want to fit the text into the shirt model like this:

How can I fit my dynamic text into the shirt model using three.js.