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>


Modified text is an extract of the original Stack Overflow Documentation
Licencjonowany na podstawie CC BY-SA 3.0
Nie związany z Stack Overflow