Aframe VR Curved plane and text

Viewed 1959

The Aframe API is supporting curved images. However, besides curved images I would like to make curved text and planes. Can someone help me out how to do this?

I think I have to make a entity, but I dont know which properties must be set.

2 Answers

Just use a-curvedimage with src="#canvas". In canvas you can generate, what you want.

<!DOCTYPE html>
<html>
    <head>
        <script src="https://aframe.io/releases/1.0.3/aframe.min.js"></script>
    </head>
    <body>

    <a-scene>
        <a-assets>
            <canvas id="myCanvas"></canvas>
        </a-assets>

        <a-curvedimage
            src="#myCanvas"
            radius="2"
            theta-length="30"
            rotation="0 160 0"
            >        
        </a-curvedimage>
    </a-scene>

    <script>
        var canvas = document.getElementById("myCanvas");
        var ctx = canvas.getContext("2d");
        ctx.fillStyle = "#000"
        ctx.font = "22px sans-serif";
        ctx.fillText("Lorem ipsum dolor sit amet", 0, 30);
    </script>
</body>
</html>

Related