Aframe text entity extending past entity height

Question

Hi I am using the master branch for aframe and the new text "component" seems to be going below the allocated height of the entity it resides in with some invisible stuff. Codepen here http://codepen.io/anon/pen/PWQXRP and try to move below the entity. Code here which was modified from the 360-image-gallery-boilerplate repo

<body>
<a-scene>
  <a-assets>
    <img id="cubes" crossorigin="anonymous" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/cubes.jpg">
  </a-assets>
  <a-sky id="image-360" radius="10" src="#cubes"></a-sky>


  <a-entity layout="type: line; margin: 1.5" position="0 0 -3">
    <a-entity 
              geometry="primitive: plane; height: 0.55; width: 1.9"
              material="shader: flat; color: red"
              text="value: Hello Worldllo Worldllo Worldllo Worldllo Worldllo Worldllo Worldllo Worldllo Worldllo Worldllo Worldllo World; color: black"></a-entity>
  </a-entity>

  <a-entity camera look-controls wasd-controls>
    <a-cursor id="cursor"
      animation__click="property: scale; startEvents: click; from: 0.1 0.1 0.1; to: 1 1 1; dur: 150"
      event-set__1="_event: mouseenter; color: springgreen"
      event-set__2="_event: mouseleave; color: black"></a-cursor>
  </a-entity>
</a-scene>

new to aframe so have no clue what I am doing wrong

ngokevin ngokevin · Accepted Answer · 2017-02-02T10:51:02

https://aframe.io/docs/master/components/text.html#scaling-geometry-to-fit-text

Scaling Geometry to Fit Text

To have the geometry automatically scale with the text, set the geometry component’s width and height properties to auto, and set the text component’s width as desired. In this example, the plane’s width will be set to 4 units, and its height will be set to match the actual height of the text:

<a-entity
  geometry="primitive: plane; height: auto; width: auto"
  material="color: blue"
  text="width: 4; value: This text will be 4 units wide."></a-entity>

Note that if neither geometry nor text specify a width, the text width property will default to 1 unit (meter), and the geometry width property will then become 1 unit as well.

<a-entity
  geometry="primitive: plane"
  material="color: blue"
  text="value: 1-wide\ndefault."></a-entity>

Aframe text entity extending past entity height

1 Answers