aframe
Raycasters (komponent)
Szukaj…
Wprowadzenie
Komponent raycaster wykonuje ogólne testy przecięcia z raycasterem. Raycasting to metoda przedłużania linii od początku w kierunku i sprawdzania, czy linia ta przecina się z innymi obiektami. Składnik raycaster jest opakowaniem na wierzchu raycaster Three.js. Sprawdza skrzyżowania w określonym przedziale z listą obiektów i będzie emitować zdarzenia na obiekcie, gdy wykryje skrzyżowania lub usunie skrzyżowania (tj. Gdy radioodbiornik nie jest już
Parametry
Parametr | Detale |
---|---|
daleko | Maksymalna odległość, pod którą zwracane są wynikowe jednostki. Nie może być niżej niż blisko. |
interwał | Liczba milisekund oczekiwania między testami przecięcia. Niższa liczba jest lepsza dla szybszych aktualizacji. Wyższa liczba jest lepsza dla wydajności. |
Blisko | Minimalna odległość, na którą zwracane są jednostki uzupełniające. Nie może być niższy niż 0. |
przedmioty | Selektor zapytań, aby wybrać obiekty do przetestowania pod kątem skrzyżowania. Jeśli nie zostanie określony, wszystkie podmioty zostaną przetestowane. |
rekurencyjny | Sprawdza wszystkie elementy potomne obiektów, jeśli są ustawione. W przeciwnym razie sprawdza tylko skrzyżowania z obiektami root. |
Uwagi
Wydarzenia
Nazwa | Detale |
---|---|
raycaster-intersected | Emitowane przez przecięty podmiot. Istota przecina się z raycasterem. Szczegóły zdarzenia będą zawierać el, element raycasting i skrzyżowanie, obiekt zawierający szczegółowe dane o skrzyżowaniu. |
raycaster-intersected-cleared | Emitowane przez przecięty podmiot. Istota nie krzyżuje się już z radiatorem. Szczegóły zdarzenia będą zawierać el, raycasting byt. |
raycaster-intersection | Emitowane na obiekcie raycasting. Raycaster przecina się z co najmniej jednym bytem. Szczegół zdarzenia będzie zawierał els, tablicę z przecinającymi się obiektami i skrzyżowania, tablicę obiektów zawierającą szczegółowe dane o skrzyżowaniach. |
raycaster-intersection-cleared | Emitowane na obiekcie raycasting. Raycaster nie krzyżuje się już z bytem. Szczegóły zdarzenia będą zawierać el, poprzednio przecinający się byt. |
Członek
Członek | Opis |
---|---|
intersectedEls | Podmioty przecinające obecnie raycaster. |
objects | obiekty Three.js do testowania skrzyżowań. Będzie sceną. Dzieci, jeśli nie określono właściwości obiektu. |
raycaster | obiekt raycaster three.js. |
Metoda
metoda | Opis |
---|---|
refreshObjects | Odświeża listę obiektów w oparciu o właściwość objects, aby sprawdzić skrzyżowanie. |
Ustalanie pochodzenia i kierunku Raycaster
Raycaster ma pochodzenie, od którego zaczyna się jego promień, i kierunek, w którym promień idzie.
Pochodzenie radiatora leży na stanowisku podmiotu radiolatarni. Możemy zmienić pochodzenie radioodtwarzacza, ustawiając komponent pozycji encji radiowej (lub encji macierzystych encji radiowej).
Kierunek radioodtwarzacza znajduje się „przed” radiatorem (tj. 0 0 -1, na ujemnej osi Z). Możemy zmienić kierunek nadajnika, ustawiając komponent obrotu jednostki nadajnika (lub jednostki nadrzędne jednostki nadajnika).
Na przykład, tutaj stosuje się raycaster wzdłuż długości obróconej kuli:
<!-- 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>
Jednostki umieszczone na białej liście w celu przetestowania na przecięciu
Zwykle nie chcemy testować wszystkiego w scenie pod kątem skrzyżowań (np. Kolizji lub kliknięć). Selektywne skrzyżowania są dobre dla wydajności, aby ograniczyć liczbę encji testowanych na przecięcie, ponieważ testowanie przecięcia jest operacją, która będzie działać ponad 60 razy na sekundę.
Aby wybrać lub wybrać obiekty, które chcemy przetestować pod kątem przecięcia, możemy użyć właściwości objects. Jeśli ta właściwość nie jest zdefiniowana, wówczas raycaster przetestuje każdy obiekt w scenie pod kątem przecięcia. obiekty przyjmuje wartość selektora zapytania:
<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>