a-entity text only showing when created by the Ins

2019-08-18 18:47发布

问题:

I've been trying to do something super simple, such as displaying some text. It was working a couple of hours back, but now it its not. This is the exact code:

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <script src="https://aframe.io/releases/0.5.0/aframe.min.js" async></script>
    <meta name="description" content="Science Labs for Homeschoolers in Virtual Reality">

</head>
<body>

<a-scene>
  <a-assets>
    <img id="groundTexture" src="https://cdn.aframe.io/a-painter/images/floor.jpg">
    <img id="skyTexture" src="https://cdn.aframe.io/a-painter/images/sky.jpg">
  </a-assets>
  <a-cylinder id="ground" src="#groundTexture" radius="30" height="0.1"></a-cylinder>
  <a-sky id="background" src="#skyTexture" theta-length="90" radius="30"></a-sky>
<a-entity position="0.768 1.04 -3.442" rotation="0 0 0" scale="10 10 2" visible="true" text="value:Hello Berry Berry;"></a-entity>    
</a-scene>
<script type="text/javascript" src="build/client/bundle.js"></script></body>

</html>

It's just a testing project. Currently using nodejs v7.10.0 with express 4.15.3 with webpack. Using Google Chrome 58.0.3 and Edge 15.

Nothing fancy, just serving the index.html file (what you're seeing above).

No matter what, I can't see the text (Only from this file). I've also tried:

  1. Looking around the scene.
  2. Setting the text double sided to spot it.
  3. Copying the exact asset from the inspector to my code.
  4. Changing the position
  5. Changing the text scale.

This is what's resulting:

As you can see, there's no sign of the text (when it should look big due to the scale settings). Any ideas? Thank you very much!

Edit: Here is with 0.5 0.5 0.5

Side note: I'm having problems uploading images to StackOverflow: http://i66.tinypic.com/a47l2b.jpg

Here's with 10 10 10: http://i67.tinypic.com/npfd50.jpg

In addition, I can't move the a-entity "graphically" (With the red, black, yellow arrows), but I can if I change them in the properties panel.

Edit 2: Here is a code share in Glitch: https://glitch.com/edit/#!/nebulous-pail?path=index.html:1:0

回答1:

Well. It seems that the problem, so far, was loading A-Frame asynchronously:

<script src="https://aframe.io/releases/0.5.0/aframe.min.js" async></script>

We need to omit the "async" attribute for it to work:

 <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>

My theory would be that it is not gracefully upgrading the element after it has been loaded.

I even tried adding the text as a mixin, but it will not work unless A-Frame has been loaded first.



标签: html aframe