Rumah > hujung hadapan web > tutorial js > Penjejakan rangka dengan JavaScript dan gerakan lompat

Penjejakan rangka dengan JavaScript dan gerakan lompat

Lisa Kudrow
Lepaskan: 2025-02-20 09:29:09
asal
962 orang telah melayarinya

Penjejakan rangka dengan JavaScript dan gerakan lompat

Ketika menggunakan JavaScript dengan teknologi generasi akan datang, gerakan Leap adalah salah satu peranti kegemaran saya untuk bekerja dengan. Dengan gerakan Leap, JavaScript bukan pemikiran selepas itu. Ia bukan modul pihak ketiga yang digodam bersama oleh peminat - ia dibangunkan dengan berhati -hati dan pertimbangan oleh pasukan Leap Motion dengan setiap pelepasan API baru. Pembebasan terbaru mereka V2.1, yang kini dalam beta, cukup menarik. Dalam artikel ini, saya akan memberikan gambaran keseluruhan keupayaan baru yang tersedia untuk pemaju JavaScript.

Takeaways Key

    LEAP MOTION API v2.1, yang kini dalam beta, menyediakan pemaju JavaScript dengan keupayaan baru untuk penjejakan rangka, termasuk data tangan tambahan dan data jari.
  • API termasuk 'hand.confidence' yang memberikan nilai untuk menunjukkan betapa tertentu peranti gerakan lompat adalah datanya. Ia juga termasuk 'hand.type' untuk menentukan sama ada ia adalah tangan kiri atau kanan, 'tangan.pinchstrength' untuk mengukur seberapa dekat ibu jari dan jari, dan 'hand.grabstrength' untuk mewakili sama ada tangan terbuka atau ditutup.
  • API Leap Motion menyediakan data jari terperinci, termasuk jenis setiap jari dan sama ada ia dilanjutkan atau tidak. Ia juga menyediakan data pada empat tulang jari di setiap jari, diperintahkan dari pergelangan tangan ke hujung setiap jari.
  • Walaupun API Motion Leap V2 juga menyokong alat dengar VR seperti Oculus VR dan menyediakan akses kepada data imej sebenar dari gerakan LEAP, ciri -ciri ini belum tersedia dalam API JavaScript.
menjejaki tangan itu dengan keyakinan yang lebih besar

API menyediakan data tambahan untuk setiap tangan keseluruhan. Data tangan boleh didapati dalam bingkai.Hands seperti yang ada di API sebelumnya, namun dalam kemas kini kami mendapat koleksi data baru yang indah yang akan menjadikan kehidupan lebih mudah untuk leap Motion Devs.

keyakinan tangan

Salah satu kemasukan kegemaran saya dalam API baru adalah keupayaan untuk mengetahui bagaimana gerakan lompat itu adalah datanya. Hand.Confidence memberikan nilai dari 0 hingga 1 yang membolehkan anda mengetahui betapa pasti apa yang dilihatnya sesuai dengan model tangan yang difahami. Nilai rendah mungkin bermakna ia tidak pasti data tangan keseluruhan atau ia bermakna ia tidak pasti kedudukan jari/tulang. Ini membolehkan anda untuk memeriksa betapa pasti gerakan lompat itu sebelum mengambil tindakan. Saya ingin melihat ini membawa kepada interaksi yang lebih lancar dan diharapkan menggalakkan pengguna menjadi sangat jelas dalam gerak isyarat mereka.

Jenis Tangan

Hand.Type berfungsi sama ada gerakan LEAP menganggap ia melihat tangan kiri atau tangan kanan. Sekiranya tangan anda berada dalam penumbuk, maka ia akan berjuang sedikit dengan perbezaan ini.

Kekuatan Pinch

hand.pinchstrength adalah harta baru yang indah yang memberikan nilai dari 0 hingga 1 yang mewakili seberapa dekat bersama ibu jari dan jari antara satu sama lain. Ini boleh membuka beberapa kemungkinan menarik untuk gerak isyarat dan mengawal aplikasi sebagai secubit adalah isyarat manusia yang baik dan semulajadi.

ambil kekuatan

hand.grabstrength mengembalikan nilai dari 0 hingga 1 sama seperti kekuatan secubit, tetapi ia mewakili sama ada tangan anda terbuka rata atau ditutup ke dalam penumbuk. Kemungkinan di sini sama -sama menarik - dapatkan pengguna anda untuk memerah bola tekanan maya atau merebut dan melemparkan sesuatu di seberang bilik maya.

data jari baru

Dalam perubahan API rangka baru, setiap tangan selalu mendapat lima jari dan anda boleh mendapatkan satu set data baru untuk setiap jari gerakan lompat dapat dilihat.

Jenis jari

Anda boleh membaca dalam apa jenis jari setiap bit data mewakili menggunakan finger.type. Objek ini akan menjadi nilai dari sifar hingga empat:

    0 adalah ibu jari
  • 1 adalah jari telunjuk
  • 2 adalah jari tengah
  • 3 adalah jari cincin
  • 4 adalah jari merah jambu
Setiap kali Leap Motion berbunyi dalam data tangan, ia membacanya dengan semua lima jari.

jari dilanjutkan

Jika sesetengah jari tidak menunjuk di atas gerakan lompat, peranti itu merekodkannya sebagai tidak dilanjutkan menggunakan finger.extended = false.

Seperti nama "Skeletal", kami mendapat data ke tulang

Saya tidak mahir dalam struktur tulang tangan, jadi saya berpeluang belajar sesuatu yang baru di sini. Doktor saya akan berbangga dengan pengetahuan saya yang diperluaskan. Di sini berharap metacarpus datang ke perbualan santai suatu hari nanti.

Gerakan Leap menyediakan data pada empat tulang jari di setiap jari, diperintahkan dari pergelangan tangan ke hujung setiap jari: metacarpal, phalanges proksimal, phalanges pertengahan dan phalanges distal. Itu tidak masuk akal untuk kebanyakan masyarakat, jadi inilah gambarajah yang indah yang saya dapati di Wikipedia Commons:

Penjejakan rangka dengan JavaScript dan gerakan lompat Butiran tulang jari

ia masuk ke dalam lebih terperinci dengan setiap tulang (saya telah mengaturnya dari pergelangan tangan ke hujung jari):

finger.carposition - kedudukan x, y dan z dari dasar tulang metacarpal.
  • finger.mcpposition - Kedudukan jari jari - tempat antara tulang phalanx metacarpal dan proksimal.
  • finger.pipposition - Kedudukan tempat antara proksimal dan falang perantaraan.
  • finger.dipposition - Kedudukan pangkal tulang distal di mana ia menghubungkan ke phalanx pertengahan.
  • Ia juga mempunyai objek untuk setiap tulang jari dengan lebih terperinci - finger.metacarpal, finger.proximal, finger.intermediate dan finger.distal. Setiap satu daripada ini diwakili dalam API Leap Motion sebagai tulang dengan butiran berikut:
  • tulang.type - nilai dari 0 hingga 4 yang mewakili jenis tulang:

  • 0 - Metacarpal

  • 1 - phalanx proksimal
  • 2 - Phalanx pertengahan
  • 3 - distal phalanx
  • 4 - lengan bawah

  • Bone.Basis - Menyediakan array dua dimensi yang mewakili vektor tulang. Anda boleh melakukan beberapa matematik yang cukup gila dengan ini untuk mengesan kedudukan jari tertentu. Saya perlu muat dalam beberapa amalan matematik sebelum saya cuba menggunakan nilai -nilai ini tetapi ia adalah cemerlang potensi di sana!

  • Bone.Prevjoint and Bone.NextJoint - Koordinat akhir tulang yang paling dekat dengan pergelangan tangan dan akhir tulang yang paling dekat dengan hujung jari masing -masing.
  • tulang.length - panjang tulang itu dalam milimeter.
  • Bone.Width - Leap Motion menerangkan ini terbaik dalam dokumen mereka sebagai "lebar purata bahagian berisi yang mengelilingi tulang ini".
  • tulang.Left - Sama ada tulang berada di sebelah kiri (jika tidak, maka ia berada di sebelah kanan, nampaknya tidak ada tulang.right)
  • tulang.center - Titik tengah tulang
  • tulang.direction - vektor arah yang tulang berada di

Pada dasarnya, itu adalah jumlah data yang baik di sana.

data dalam demo dengan banyak nombor

Saya melemparkan demo cepat untuk menunjukkan betapa banyak data koordinat yang mengalir melalui API ini. Demo berikut menunjukkan koordinat untuk setiap jari. Ia hanya sebahagian kecil daripada data yang tersedia juga!

Demo kelihatan seperti ini:

Penjejakan rangka dengan JavaScript dan gerakan lompat

anda boleh mencubanya dalam tindakan dengan gerakan lompatan anda di sini.

ada lagi yang akan datang!

Terdapat lebih banyak API gerakan V2 Leap daripada ciri -ciri ini, ia juga mempunyai sokongan untuk alat dengar VR seperti Oculus VR dan juga menyediakan akses kepada data imej sebenar dari gerakan LEAP. Malangnya, ciri -ciri ini tidak terdapat dalam API JavaScript baru -baru ini tetapi diharapkan kita akan melihatnya tidak lama lagi sebelum API meninggalkan beta!

Sumber lain

Jika anda sedang mencari maklumat lanjut tentang memulakan API ini, tempat terbaik untuk pergi ialah tapak pemaju gerakan LEAP:

  • Dokumentasi JavaScript SDK
  • Galeri Leap Motion JavaScript Demo, lihat kod sumber untuk beberapa wawasan yang baik!

soalan yang sering ditanya mengenai penjejakan rangka dengan JavaScript dan Leap Motion

Bagaimanakah gerakan Leap berfungsi dengan JavaScript untuk penjejakan rangka? Ia berfungsi dengan JavaScript melalui Perpustakaan LeapJS, yang menyediakan API yang mudah dan intuitif untuk mengakses data gerakan Leap. Ini membolehkan pemaju membuat aplikasi interaktif yang boleh menjejaki dan bertindak balas terhadap pergerakan tangan. Perpustakaan Leapjs menyediakan kaedah untuk menjejaki kedudukan, halaju, dan orientasi tangan, jari, dan alat, serta untuk mengesan gerak isyarat seperti swipes, lingkaran, dan paip. Menggunakan gerakan Leap with JavaScript?

Untuk menggunakan gerakan Leap dengan JavaScript, anda memerlukan komputer dengan port USB 2.0, menjalankan Windows 7 atau lebih baru, Mac OS X 10.7 atau lebih baru, atau Linux. Anda juga memerlukan perisian Leap Motion, yang termasuk Perpustakaan Leapjs. Perisian ini boleh dimuat turun dari laman web Leap Motion. Di samping itu, anda memerlukan penyemak imbas web yang menyokong WebGL, seperti Chrome, Firefox, atau Safari. Sediakan gerakan Leap untuk digunakan dengan JavaScript, muat turun pertama dan pasang perisian Leap Motion dari laman web Leap Motion. Kemudian, sambungkan pengawal gerakan LEAP ke komputer anda dengan kabel USB. Perisian Leap Motion secara automatik akan mengesan pengawal dan mula menjejaki. Untuk menggunakan gerakan Leap dengan JavaScript, sertakan perpustakaan leapjs dalam fail HTML anda dengan tag skrip. digunakan untuk membangunkan pelbagai aplikasi, dari permainan dan pengalaman realiti maya untuk alat pendidikan dan visualisasi saintifik. Keupayaan untuk mengesan pergerakan tangan dalam ruang 3D membuka kemungkinan baru untuk interaksi pengguna, yang membolehkan pengguna mengawal aplikasi dengan cara yang lebih semula jadi dan intuitif. 🎜>

LEAP MOTION menyediakan penjejakan rangka yang sangat tepat, dengan ketepatan sehingga 0.01mm. Ia boleh menjejaki kedudukan dan orientasi setiap jari dan telapak tangan, serta mengesan gerak isyarat seperti swipes, bulatan, dan paip. Perpustakaan LeapJS menyediakan API yang mudah dan intuitif untuk mengakses data ini, menjadikannya mudah untuk dimasukkan ke dalam aplikasi JavaScript.

Bolehkah saya menggunakan gerakan Leap dengan bahasa pengaturcaraan lain selain JavaScript? Ini menjadikannya alat yang serba boleh untuk pemaju, membolehkan mereka memilih bahasa yang paling sesuai dengan keperluan dan kemahiran mereka. JavaScript menyediakan alat yang berkuasa untuk membangunkan aplikasi interaktif, terdapat beberapa batasan yang perlu diperhatikan. Pengawal gerakan Leap memerlukan garis penglihatan yang jelas ke tangan, dan boleh dipengaruhi oleh cahaya terang atau permukaan reflektif. Di samping itu, sementara Perpustakaan LeapJS menyediakan API yang mudah dan intuitif, ia mungkin tidak menawarkan tahap kawalan dan fleksibiliti yang sama seperti SDK untuk bahasa lain. 🎜> Jika anda menghadapi masalah dengan Leap Motion dan JavaScript, terdapat beberapa langkah yang boleh anda ambil. Pertama, pastikan pengawal gerakan LEAP disambungkan dan perisian gerakan LEAP sedang berjalan. Sekiranya pengawal tidak dikesan, cuba cabut dan memasukkannya semula. Jika anda menghadapi masalah dengan perpustakaan LeapJS, pastikan anda menggunakan pelayar web yang serasi dan periksa konsol JavaScript untuk kesilapan. 🎜> Bolehkah saya menggunakan gerakan Leap dengan JavaScript pada peranti mudah alih?

Pada masa ini, gerakan LEAP tidak menyokong peranti mudah alih. Pengawal gerakan Leap memerlukan sambungan USB, yang biasanya tidak tersedia pada peranti mudah alih. Walau bagaimanapun, Leap Motion terus membangun dan memperbaiki teknologi mereka, jadi ini mungkin berubah pada masa akan datang. Sumber -sumber yang terdapat dalam talian untuk belajar bagaimana menggunakan gerakan Leap dengan JavaScript. Laman web Leap Motion menyediakan banyak maklumat, termasuk panduan pemaju, dokumentasi API, dan forum komuniti. Di samping itu, terdapat banyak tutorial dan contoh yang terdapat di laman web seperti GitHub dan Stack Overflow.

Atas ialah kandungan terperinci Penjejakan rangka dengan JavaScript dan gerakan lompat. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan