Отражать положение пользователя и вращение во время выполнения на миникарте в Aframe

Question

Я пытаюсь сделать миникарту для моей виртуальной сцены и обновить положение и местоположение пользователя во время выполнения. Я уже сделал следующее:

<script>
        AFRAME.registerComponent('cam-listener', {
            init: function(){
                var canvas = document.querySelector("#myCanvas");
                //line 124(log result in the image)
                console.log(canvas);
                var context = canvas.getContext("2d");
                //line 126(log result in the image)
                console.log(context);

                function drawTriangle(x, y) {
                  // the triangle
                  context.beginPath();
                  context.moveTo(x, y);
                  context.lineTo(x - 6, y + 10);
                  context.lineTo(x + 6, y + 10);
                  context.closePath();

                  // the outline
                  context.lineWidth = 4;
                  context.strokeStyle = "rgba(102, 102, 102, 1)";
                  context.stroke();

                  // the fill color
                  context.fillStyle = "rgba(255, 204, 0, 1)";
                  context.fill();
                }
                drawTriangle(100, 100);
            }
            tick: function(){
                console.log(this.el.getAttribute('position'));
                console.log(document.querySelector('[camera]').getAttribute('rotation'));
            }
        })
 </script>

ниже div и canvas:

<div id="canvasWrapper">
        <canvas id="myCanvas" width="223.99" height="358.93">
        </canvas>
</div>

но дело в том, что когда я запускаю скрипт, консоль дает мне очень запутанный результат:(ниже ссылка на изображение)

холст получен, но контекст нулевой

но если я не использую систему компонентов Aframe и не ставлю скрипты внизу тела, все работает. Так кто-нибудь знает причину? Заранее спасибо!

Кстати, если кто-нибудь знает, как сделать миникарту на сцене Aframe vr, я рад обсудить и узнать. Если нет, я опубликую свое решение позже.