Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot read property 'array' of undefined TextGeometry computeBoundingSphere error #4618

Closed
jgutierro opened this issue Jun 10, 2020 · 9 comments

Comments

@jgutierro
Copy link

Description:
I'm getting an error with the cd01cec version.
On this url you can see the error when you focus the pointer on the green marks

index.js:96 Uncaught TypeError: Cannot read property 'array' of undefined at TextGeometry.computeBoundingSphere (index.js:96) at H.raycast (three.js:11367) at Fa (three.js:46525) at Ba.intersectObjects (three.js:46600) at i.checkIntersections (raycaster.js:226) at i.tick (raycaster.js:198) at HTMLElement.tick (a-scene.js:719) at HTMLElement.render (a-scene.js:769) at bind.js:12 at m (three.js:25084)

With version 1.0.4 this works fine, but VR is not working on iOS 13.4.1...

@vincentfretin
Copy link
Contributor

vincentfretin commented Jun 11, 2020

Ah yeah I have this error on master too. I forgot to create a separate issue for it.
I put the traceback in comment #4588 (comment)
I narrowed it down to the update of super-three from 113 to 115.1. I'm currently using aframe master with downgrade of super-three to 113.
So the culpurit is not an aframe commit, it's a commit in three.
I didn't have time to look further into it.

@vincentfretin
Copy link
Contributor

The error seems to be in three-bmfont-text, something must have changed between super-three 113 and 115.1 that cause the error in three-bmfont-text.

@vincentfretin
Copy link
Contributor

I can't reproduce on my project now... weird.
The issue for me was triggered on a <a-text> component that was shown when the parent entity had mouseenter. I have mainly those entities in my scene using text:

        <a-entity position="-0.56 5.7 -2.18" rotation="0 17 0">
          <a-plane class="clickable" height="0.71" width="1"
            material="src:img/anImage.png; shader: flat;"
            toggle-child-visibility-on-mouseenter                               
          >                                                                     
            <a-plane material="color: #111; shader: flat;" visible="false" width="1.2" height="0.15" position="0 0.44 0">
              <a-text position="0 0.015 0" scale="0.5 0.5 0.5"                  
                align="center"                                                  
                value="Some text"                                     
                font="../dist/custom-msdf.json"                                 
                negate="false"                                                  
              ></a-text>                                                        
            </a-plane>                                                          
          </a-plane>                                                            
        </a-entity>

Nothing fancy.

For reference, there was a similar issue some years ago #3318

@vincentfretin
Copy link
Contributor

I may have changed something in my project during this past month and the error doesn't trigger anymore for me.
@jgutierro Can you please try to create a very small example with https://glitch.com where you reproduce the issue?

@vincentfretin
Copy link
Contributor

Please note I was having the issue on both firefox and chrome desktop, but not every time if I remember. :)

@vincentfretin
Copy link
Contributor

I see @NomisGnos has the issue sometimes too
#3318 (comment)

@vincentfretin
Copy link
Contributor

vincentfretin commented Jun 11, 2020

For the index.js:96 Uncaught TypeError: Cannot read property 'array' of undefined error, this is acutally the position attribute that's undefined. See code here https://github.com/dmarcos/three-bmfont-text/blob/7afd1e480bde20e745d8536ef2f234db80e472fc/index.js#L96

For the traceback, I see Mesh.raycast (three.js:11367) so it tries to raycast the a-text component.
Ah I did fix an issue with my project where "objects: .clickable" was actually missing in my raycaster component because I defined only cursor="fuse:false" component and it implicitly create a raycaster component with not config. Then after a delay I was setting raycaster="objects:.clickable". So during the delay, all the entities in the scene was raycastable (including <a-text>), so this could explains the random issue.
To avoid the issue, you shouldn't raycast <a-text> but a simple <a-plane> as the parent.

@vincentfretin
Copy link
Contributor

@jgutierro I see you have the following warning on your page
[raycaster] For performance, please define raycaster.objects when using raycaster or cursor components to whitelist which entities to intersect with. e.g., raycaster="objects: [data-raycastable]"
By fixing this warning, this should fix the issue.
I see you use <a-cursor, it may create a raycaster component without config, try to add raycaster="objects: .link" on it too.

@jgutierro
Copy link
Author

Hello @vincentfretin adding raycaster="objects: .link" to my <a-cursor solved the issue! thank you so so much for your amazing and dedicated support and help!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants