Link Search Menu Expand Document

How to renader 3D

Letsee WebAR SDK는 다양한 WebGL 기반의 3D 프레임워크를 지원합니다. 이 튜토리얼은 Three.js를 이용한 3D 기반의 ARWebApp을 만드는 방법을 설명합니다.

증강을 위한 Entity 설정

증강할 대상을 addTarget 이벤트의 매개변수로 설정합니다.

letsee.addTarget('letsee-marker.json').then(entity => {})

Web AR SDK 실행 및 three.js

letsee의 init 이벤트 실행, ready 이벤트의 callback에 start 이벤트를 등록하여 어플리케이션을 실행합니다. letsee와 three.js의 증강 데이터를 addTHREE 이벤트를 이용하여 싱크를 맞추고 three.js 의 Object를 반환값으로 받습니다.

letsee.ready(() => {
  letsee.start();
  letsee.addTHREE(THREE).then(obj => {
    camera = obj.camera;
    renderer = obj.renderer;
    scene = obj.scene;
    initWorld(obj);
  })
});
letsee.init();

Render All

프레임 단위로 render합니다.

const renderAll = async function () {
    requestAnimationFrame(renderAll);
    renderer.render(scene, camera);
};
renderAll();

Table of contents