search

lojjic / aframe-troika-text

An A-Frame component for rendering 3D text using troika-three-text
MIT License
72 stars 12 forks source link

Inconsistent bounding boxes #70

Closed Utopiah closed 1 year ago

Utopiah commented 1 year ago

Hi,

I tried to repeat https://github.com/AdaRoseCannon/aframe-htmlmesh/issues/4 here but it didn't work. I tried making a bounding box but the geometry was very different from what I expected, namely a square rather than a rectangle.

In the screenshot below I can show one that worked, the lower one, and one that didn't, despite using the same code

el = new THREE.BoxHelper( document.getElementById("locationreload").object3D.children[0], 0x00ff00 ); AFRAME.scenes[0].object3D.add(el)

image

Is somehow forcing a sync() necessary? Did I miss a step? Note that I did that via the console and seconds after the scene was displayed so I'm relatively confident everything was loaded, at least displayed as it should. I also noticed https://github.com/lojjic/aframe-troika-text/issues/38 before but again, I'm not doing it right after adding the element so not sure it would relevant here.

Anyway, what is the recommended way to add a background behind an entire element or part of it?

PS: I noticed https://protectwise.github.io/troika/troika-three-text/#carets-and-selection-ranges that could later on be useful to highlight words or lines but didn't dive in there before being able to have the entire element.

Utopiah commented 1 year ago

The AFrame inspector also makes the square bounding boxes on element selection

image
Utopiah commented 1 year ago
image

If I change value from 12345 to 1 the bounding box does seems like it is update properly so... maybe unrelated, maybe a threejs/AFrame boxhelper issue. Leaving this open for now as I still investigate.

Utopiah commented 1 year ago

Seems it's a boxhelper issue as the boundingbox itself seems fine and creating a boxgeometry from it works as expected. Less convenient but sufficient to add a background.

image
lojjic commented 1 year ago

My suspicion is the BoxHelper was reading the geometry.boundingBox before the text sync() callback is complete and not getting updated afterward? 🤷

lijualivenow commented 1 year ago

I am facing the same issue, the bounding box is not getting properly

Utopiah commented 1 year ago

@lijualivenow try checking 1000ms after creating the entity and if it does make a difference tried indeed .sync() and check after, iirc worked for me.

lijualivenow commented 1 year ago

@Utopiah, after 1000ms it's working, thank you.