examples/animation/countup/AnimePinCurveText.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>AnimePinCurveTextSample</title>
        <script src="https://resource.mapray.com/mapray-js/v0.9.5/mapray.min.js"></script>
        <link rel="stylesheet" href="https://resource.mapray.com/styles/v1/mapray.css">
        <script src="AnimePinCurveText.js"></script>
        <script src="CosCurveText.js"></script>
        <script src="CheckInputKeyAndMouse.js"></script>
        <style>
            html, body {
                height: 100%;
                margin: 0;
            }

            div#mapray-container {
                display: flex;
                position: relative;
                height: 100%;
            }

            #tools {
                position: fixed;
                font-family: monospace;
                bottom: 50px;
                left: 10px;
                background: black;
                color: white;
                padding: 10px;
            }
        </style>
    </head>

    <body onload="new AnimePinCurveText('mapray-container');">
      <div id="mapray-container"></div>
      <div id="tools">Click mouse to start animation.</div>
    </body>
</html>