XRElement 란?

Letsee WebAR SDK 는 tracker 로부터 인식된 XR 공간에 HTMLElement 를 정합하여 나타낼 수 있습니다. 이 때, XR 공간에 정합하려는 HTMLElement (DomElement) 를 XRElement 라 지칭하고 있습니다.

XRElement는 XR 공간을 생성하는 인식대상인 엔터티의 자식 객체로 관리됩니다. XRElement 를 생성, Entity에 바인딩하는 방법은 다음과 같습니다.

XRElement 의 생성

1. HTML 에 마크업으로 기술된 DomElement 를 이용하여 생성하는 방법

   var dom = document.getElementById('[DomElement ID]');
   
   /* XRElement 를 생성만 할 때 */
   letsee.createXRElement(dom);
   
   /* XRElment 를 생성하면서 entity 에 바인딩까지 할 때 */
   var entity = letsee.getEntityByUri('[생성된 ENTITY URI]');
   letsee.createXRElement(dom, entity);
   

2. 스크립트를 이용하여 HTML 요소를 만들고, 이 HTML 요소를 이용하여 생성하는 방법

   var dom = document.createElement('div');
   dom.id = 'xr_01';
   dom.innerHTML = 'This is XRElement';
   
   /* XRElement 를 생성만 할 때 */
   letsee.createXRElement(dom);
   
   /* XRElment 를 생성하면서 entity 에 바인딩까지 할 때 */
   var entity = letsee.getEntityByUri('[생성된 ENTITY URI]');
   letsee.createXRElement(dom, entity);
   

생성된 XRElement 개체에 접근

1. element ID 를 이용한 접근

   var xrElement = letsee.getXRElementById('[DomElement ID]');
   

2. element class name 을 이용한 접근

   var xrElements = letsee.getXRElementByClassName('[DomElement class name]');
   

3. entity 에 바인딩 된 모든 XRElement 에 대한 접근

   var entity = letsee.getEntityByUri('[생성된 ENTITY URI]');
   var xrElements = letsee.getAllXRElements(entity);
   

XRElement 를 Entity 에 바인딩

var xrElement = letsee.getXRElementById('[DomElement ID]');
var entity = letsee.getEntityByUri('[생성된 ENTITY URI]');

letsee.bindXRElement(xrElement, entity);

XRElement 를 Entity 로부터 언바인딩

var xrElement = letsee.getXRElementById('[DomElement ID]');
letsee.unbindXRElement(xrElement);

생성된 XRElement 를 제거

var xrElement = letsee.getXRElementById('[DomElement ID]');
letsee.removeXRElement(xrElement);

Entity에 바인딩된 모든 XRElement 를 제거

var entity = letsee.getEntityByUri('[생성된 ENTITY URI]');
letsee.removeAllXRElements(entity);