Search code examples
webvraframe

How can I display text in A-Frame?


For http://aframe.io/, how can I render text without having to create an image?


Solution

  • EDIT: A text component has landed in A-Frame master branch. This will roll out in 0.5.0. The component will have support for fonts, alignments, anchors, baselines, shaders, etc. <a-entity text="value: HELLO"></a-entity> https://aframe.io/docs/master/components/text.html

    You can use some of the community components:

    I recommend the Bitmap Font Text Component which is performant and looks visually good:

    <html>
      <head>
        <script src="https://aframe.io/releases/0.2.0/aframe.min.js"></script>
        <script src="https://rawgit.com/bryik/aframe-bmfont-text-component/master/dist/aframe-bmfont-text-component.min.js"></script>
      </head>
      <body>
        <a-scene>
          <a-entity bmfont-text="text: HELLO!; color: #333" position="0 0 -5"></a-entity>
        </a-scene>
      </body>
    </html>