I'd like a width property that is like a textbox width for alignment purposes

I’m attempting to use troika-three-text to draw multiline text entities of CAD files. I want to give it a specific textbox width for alignment purposes.

Say the maxWidth is 100, the alignment is center, and the maximum that any line actually covers is 50. Currently, the text produced by troika-three-text is centered as if the “text box” is 50 wide, not 100 wide. Thus it is shifted to the left of it’s intended position.

It seems like this might be an easy thing to do. This line of code uses maxLineWidth which is the longest line of text (not the explicitly set maxWidth). I propose we add a width field to the options that effectively forced maxLineWidth to the given value.

[bzuillsmith]

Got it, makes sense. It definitely sounds like this will work to get the position without a sync callback and bounding box. The only downside I can think of is that the position won’t reflect the original CAD anchor point anymore, but it’s probably not a big deal. Currently what I’m working on is only a viewer, though some people have been forking it to make it interactive and add features.

[lojjic]

OK, if you run into issues let me know and I’ll think how to improve it for you.

But I do think that with your original example of a “textbox” with a fixed width of 100, this should give equivalent behavior without having to measure the text bounds:

const textBoxWidth = 100
text.maxWidth = textBoxWidth
text.anchorX = 'center'
text.position.x = xPosFromCAD + textBoxWidth / 2

You can just think of anchorX as what horizontal position in the text you want to remain stable. If you’re center-aligning text in a fixed-width box, you want that point to be the text’s center. And then you just position that anchor point at the fixed-width box’s centerpoint.