3D-объекты движутся или исчезают при использовании A-Frame - PullRequest
Новая
       34

3D-объекты движутся или исчезают при использовании A-Frame

1 голос
/ 30 января 2020

Я пытаюсь добавить объекты без маркера, используя AR. js и A-Frame, поэтому я могу загружать точки в зависимости от их местоположения, однако иногда объекты (точки) быстро меняют положение или полностью исчезают. Ниже мой код и изображение того, как объект отображается на моем телефоне.

Можно ли как-нибудь удержать объекты (в моем случае, точки)?

enter image description here

    <!--aframe latest version-->
    <script src='https://aframe.io/releases/1.0.3/aframe.min.js'></script>

    <!--aframe-ar latest version-->
    <script src="https://raw.githack.com/jeromeetienne/AR.js/2.1.5/aframe/build/aframe-ar.js"></script>

    <!--three.js-->
    <script>
        THREEx.ArToolkitContext.baseURL = 'https://raw.githack.com/jeromeetienne/ar.js/master/three.js/'
    </script>

    <!--insert style-->
    <link rel="stylesheet" type="text/css" href="css/style.css"/>

</head>

<!--the interface system using aframe-->
<body style='margin: 0; overflow: hidden;'>

    <div class="content">

        <header class="app-header">

            <!--inside header-->
            <div class="container">

                <!--text instruction-->
                <p><a href="https://xxx.xxx.xxx" style="text-decoration:none">Welcome to GIS AR</a></p>

            <!--end div-->
            </div>

        <!--end header-->
        </header>

    <!--scene for AR enviroment-->
    <a-scene
        vr-mode-ui="enabled: false"
        embedded
        arjs='sourceType: webcam; sourceWidth:1280; sourceHeight:960; displayWidth: 1280; displayHeight: 960; debugUIEnabled: false;'>

        <!--point 1-->
           <a-entity 
               gltf-model="./assets/point/scene.gltf" 
               rotation="0 0 0" scale="1 1 1" 
               gps-entity-place="latitude: x.xxxxxx; longitude: xxx.xxxxx;" 
               animation-mixer>
                   <a-text
                   value="Object1"
                   z-offset="2"
                   color="blue"
                   scale="7, 7"
                   position="-2.5 10 0"
                   ></a-text>
           </a-entity>

           <!--point 2-->
           <a-entity 
               gltf-model="./assets/point/scene.gltf" 
               rotation="0 0 0" scale="1 1 1" 
               gps-entity-place="latitude: x.xxxxxx; longitude: xxx.xxxxx;"  
               animation-mixer>
                   <a-text
                   value="Object2"
                   z-offset="2"
                   color="blue"
                   scale="7, 7"
                   position="-2.5 10 0"
                   ></a-text>
           </a-entity>

           <!--point 3-->
           <a-entity 
               gltf-model="./assets/point/scene.gltf" 
               rotation="0 0 0" scale="1 1 1" 
               gps-entity-place="latitude: x.xxxxxx; longitude: xxx.xxxxx;" 
               animation-mixer>
                   <a-text
                   value="Object3"
                   z-offset="2"
                   color="blue"
                   scale="7, 7"
                   position="-2.5 10 0"
                   ></a-text>
           </a-entity>

        <!--camera properties-->
        <a-camera gps-camera rotation-reader></a-camera>

    </a-scene>
...