Niedawno natknąłem się na kilka witryn, które wydają się mieć dostęp do akcelerometru lub żyroskopu w moim laptopie, wykrywając zmiany orientacji lub ruchu.
Jak to się robi? Czy muszę zapisać się na jakieś wydarzenie nawindow
obiekcie?
Na jakich urządzeniach (laptopach, telefonach komórkowych, tabletach) to działa?
NB : Właściwie znam już (część) odpowiedź na to pytanie i zaraz ją opublikuję. Powodem, dla którego zadaję to pytanie, jest poinformowanie wszystkich innych, że dane akcelerometru są dostępne w Javascript (na niektórych urządzeniach) i wezwanie społeczności do opublikowania nowych odkryć na ten temat. Obecnie wydaje się, że prawie nie ma dokumentacji dotyczącej tych funkcji.
javascript
accelerometer
gyroscope
Jørn Schou-Rode
źródło
źródło
Odpowiedzi:
Sposobem na to w 2019+ jest użycie
DeviceOrientation
API . Działa to w większości nowoczesnych przeglądarek na komputerach stacjonarnych i urządzeniach mobilnych.źródło
Obecnie istnieją trzy różne zdarzenia, które mogą, ale nie muszą, zostać wyzwolone podczas przenoszenia urządzeń klienckich. Dwie z nich koncentrują się na orientacji, a ostatnia na ruchu :
ondeviceorientation
wiadomo, że działa na komputerowej wersji Chrome, a większość laptopów Apple wydaje się mieć sprzęt wymagany do tego. Działa również w Mobile Safari na iPhonie 4 z iOS 4.2. W funkcji obsługi zdarzeń, można uzyskać dostępalpha
,beta
,gamma
wartości na podstawie danych o zdarzeniach, dostarczanych jako jedyny argument funkcji.onmozorientation
jest obsługiwany w przeglądarce Firefox 3.6 i nowszych. Ponownie, wiadomo, że działa to na większości laptopów Apple, ale może działać również na komputerach z systemem Windows lub Linux z akcelerometrem. W funkcji obsługi zdarzenia, szukaćx
,y
,z
pola dotyczące danych o zdarzeniach dostarczane jako pierwszy argument.ondevicemotion
działa na iPhonie 3GS + 4 i iPadzie (oba z iOS 4.2) i dostarcza danych związanych z aktualnym przyspieszeniem urządzenia klienckiego. Dane zdarzeń przekazywane do funkcji obsługi maacceleration
iaccelerationIncludingGravity
, które oba mają trzy pola dla każdej osi:x
,y
,z
Przykładowa witryna internetowa „wykrywanie trzęsień ziemi” wykorzystuje serię
if
instrukcji, aby ustalić, do którego zdarzenia należy się dołączyć (w nieco uporządkowanej kolejności) i przekazuje otrzymane dane do wspólnejtilt
funkcji:Stałe współczynniki 2 i 50 służą do „wyrównania” odczytów z dwóch ostatnich wydarzeń z odczytami z pierwszego, ale nie są to bynajmniej dokładne reprezentacje. W przypadku tego prostego projektu "zabawki" działa to dobrze, ale jeśli chcesz wykorzystać dane do czegoś nieco poważniejszego, będziesz musiał zapoznać się z jednostkami wartości podanymi w różnych wydarzeniach i traktować je z szacunkiem :)
źródło
Nie mogę dodać komentarza do doskonałego wyjaśnienia w innym poście, ale chciałem wspomnieć, że świetne źródło dokumentacji można znaleźć tutaj .
Wystarczy zarejestrować funkcję zdarzenia dla akcelerometru:
z przewodnikiem:
W przypadku magnetometru należy zarejestrować następujący program obsługi zdarzeń:
z przewodnikiem:
Istnieją również pola określone w zdarzeniu ruchu dla żyroskopu, ale wydaje się, że nie jest to uniwersalnie obsługiwane (np. Nie działało na Samsung Galaxy Note).
Na GitHubie jest prosty działający kod
źródło
Przydatne rozwiązanie awaryjne tutaj: https://developer.mozilla.org/en-US/docs/Web/Events/MozOrientation
źródło