3D模型的A幀抖動

Question

我正在嘗試使用 hiro 模式增強汽車模型，但存在抖動。

 <!DOCTYPE html> <html lang="en"> <head> <title>augmented reality</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- A FRAME --> <script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script> <script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.0/aframe/build/aframe-ar.js" crossorigin="anonymous"></script> <script src="https://cdn.rawgit.com/donmccurdy/aframe-extras/v3.8.4/dist/aframe-extras.min.js" crossorigin="anonymous"></script> <script src="https://rawgit.com/mayognaise/aframe-gif-shader/master/dist/aframe-gif-shader.min.js" crossorigin="anonymous"></script> <script src="https://unpkg.com/aframe-event-set-component@^4.0.0/dist/aframe-event-set-component.min.js"></script> <!-- import events.js script --> <script src="https://rawgit.com/nicolocarpignoli/nicolocarpignoli.github.io/master/ar-playground/events.js"></script> <!-- import the webpage's stylesheet --> <link rel="stylesheet" href="/style.css"> <!-- import the webpage's javascript file --> <script src="/script.js" defer></script> </head> <body> <a-scene shadow="type: pcfsoft" embedded arjs='sourceType: webcam; debugUIEnabled: false;' debug> <a-marker preset="hiro"> <a-entity shadow="cast: true" gltf-model="https://cdn.glitch.com/0d1945ac-ed6f-44be-9903-e1c1626575a4%2Fcar.glb?1548349423434" position="0 0 0" crossOrigin="anonymous" response-type="arraybuffer" rotation="0 0 0" scale="0.05 0.05 0.05"> </a-entity> </a-marker> <a-entity light="type: ambient; color: #CCC"></a-entity> <a-entity camera></a-entity> </a-scene> <!-- include the Glitch button to show what the webpage is about and to make it easier for folks to view source and remix --> <div class="glitchButton" style="position:fixed;top:20px;right:20px;"></div> <script src="https://button.glitch.me/button.js"></script> </body> </html>

當相機離標記比物體更近時，抖動（損壞的紋理）會少一些，但是當相機距離很遠時（增加標記和相機之間的距離，則抖動會增加，如附加圖像中所示。

遠時

更近一點

遠的

Answer 1

這背后可能有一個 AR.js 錯誤： https : //github.com/jeromeetienne/AR.js/issues/410

一種解決方法是在</body>之前添加此代碼：

<script>
// Workaround for an AR.js bug (https://github.com/jeromeetienne/AR.js/issues/410)
const sceneEl = document.querySelector('a-scene');
sceneEl.addEventListener('loaded', () => {
    sceneEl.camera = new THREE.PerspectiveCamera();
});
</script>

3D模型的A幀抖動

問題描述

1 個解決方案

解決方案1
1 已采納 2019-02-10 01:29:44

3D模型的A幀抖動

問題描述

1 個解決方案

解決方案1 1 已采納 2019-02-10 01:29:44

解決方案1
1 已采納 2019-02-10 01:29:44