aframe
레이 캐스터 (구성 요소)
수색…
소개
raycaster 구성 요소는 raycaster와의 일반적인 교차 테스트를 수행합니다. 레이 캐스팅은 원점에서 방향으로 라인을 연장하고 그 라인이 다른 엔트리와 교차하는지 여부를 확인하는 방법입니다. raycaster 구성 요소는 three.js 레이 캐스터 위에있는 래퍼입니다. 객체 목록에 대해 특정 간격으로 교차점을 확인하고 교차점을 찾거나 교차점을 지울 때 (즉, Raycaster가 더 이상 존재하지 않을 때) 엔티티에서 이벤트를 내 보냅니다
매개 변수
| 매개 변수 | 세부 |
|---|---|
| 멀리 | 결과 엔티티가 반환되는 최대 거리입니다. 근처에서 낮을 수는 없습니다. |
| 간격 | 각 교차 테스트 사이에 대기 할 시간 (밀리 초)입니다. 낮은 숫자는 더 빠른 업데이트에 더 좋습니다. 숫자가 높으면 성능이 좋습니다. |
| 가까운 | Resuilting 엔티티가 반환되는 최소 거리. 0보다 작을 수 없습니다. |
| 사물 | 교차를 테스트 할 객체를 선택하는 쿼리 선택기입니다. 지정하지 않으면 모든 엔티티가 테스트됩니다. |
| 재귀적인 | 설정된 경우 개체의 모든 자식을 검사합니다. Else는 루트 객체와의 교차점 만 검사합니다. |
비고
이벤트
| 이름 | 세부 |
|---|---|
raycaster-intersected | 교차 된 엔티티에서 방출됩니다. 개체가 레이 캐스터와 교차합니다. 이벤트 세부 정보에는 엘 캐스팅 개체, 교차로, 교차로에 대한 자세한 데이터가 포함 된 개체가 포함됩니다. |
raycaster-intersected-cleared | 교차 된 엔티티에서 방출됩니다. 엔티티는 더 이상 레이 캐스터와 교차하지 않습니다. 이벤트 세부 사항에는 raycasting 엔티티 인 el이 포함됩니다. |
raycaster-intersection | 레이 캐스팅 엔티티에서 방출됩니다. Raycaster는 하나 이상의 엔티티와 교차합니다. 이벤트 세부 정보에는 els, 교차 된 엔티티가있는 배열 및 교차점, 교차점에 대한 자세한 데이터가 들어있는 객체 배열이 포함됩니다. |
raycaster-intersection-cleared | 레이 캐스팅 엔티티에서 방출됩니다. Raycaster는 더 이상 엔티티와 교차하지 않습니다. 이벤트 세부 정보에는 이전에 교차 된 항목 인 el이 포함됩니다. |
회원
| 회원 | 기술 |
|---|---|
intersectedEls | 현재 레이 캐스터와 교차하는 엔티티입니다. |
objects | intersects를 테스트하는 three.js 객체. object 속성이 지정되지 않은 경우 scene.children이됩니다. |
raycaster | three.js raycaster 개체입니다. |
메도 드
| 방법 | 기술 |
|---|---|
refreshObjects | 교차점을 테스트 할 객체 속성을 기반으로 객체 목록을 새로 고칩니다. |
Raycaster의 원점과 방향 설정하기
raycaster에는 광선이 시작되는 원점과 광선이가는 방향이 있습니다.
raycaster의 출처는 raycaster 엔터티의 위치에 있습니다. 우리는 raycaster 엔티티 (또는 raycaster 엔티티의 부모 엔티티)의 위치 구성 요소를 설정하여 raycaster의 원점을 변경할 수 있습니다.
레이 캐스터의 방향은 레이 캐스터 개체의 "앞에"있습니다 (즉, 0 - 1, 음의 Z 축에 있음). 우리는 raycaster 엔티티 (또는 raycaster 엔티티의 부모 엔티티)의 회전 구성 요소를 설정하여 raycaster의 방향을 변경할 수 있습니다.
예를 들어, 다음은 회전 된 글 머리 기호의 길이를 따라 레이 캐스터를 적용하는 것입니다.
<!-- Bullet, rotated to be parallel with the ground. -->
<a-entity id="bullet" geometry="primitive: cylinder; height: 0.1" rotation="-90 0 0">
<!-- Raycaster, targets enemies, made to be as long as the bullet, positioned to the start of the bullet, rotated to align with the bullet. -->
<a-entity raycaster="objects: .enemies; far: 0.1" position="0 -0.5 0" rotation="90 0 0"></a-entity>
</a-entity>
화이트리스트 엔터티가 교차로를 테스트합니다.
우리는 일반적으로 교차점 (충돌이나 클릭과 같은)에 대해 장면의 모든 것을 테스트하고 싶지 않습니다. 선택적 교차는 교차 테스트가 초당 60 회 이상 실행되는 작업이므로 교차 테스트를 수행 할 엔티티의 수를 제한하는 성능에 적합합니다.
교차점을 테스트 할 엔티티를 선택하거나 선택하려면 objects 속성을 사용할 수 있습니다. 이 프로퍼티가 정의되어 있지 않으면, 레이 캐스터는 장면의 모든 오브젝트가 교차하는지 테스트합니다. 개체는 쿼리 선택기 값을가집니다.
<a-entity raycaster="objects: .clickable" cursor></a-entity>
<a-entity class="clickable" geometry="primitive: box" position="1 0 0"></a-entity>
<a-entity class="not-clickable" geometry="primitive: sphere" position="-1 0 0"></a-entity>