تتيح أحداث حركة الجهاز والاتجاه الوصول إلى مقياس التسارع والجيروسكوب والبوصلة المدمجة في الأجهزة الجوّالة.
ويمكن استخدام هذه الأحداث لأغراض متعددة، في الألعاب مثلاً للتحكم في اتجاه الشخصية أو مسارها. وعند استخدامها مع رصد الموقع الجغرافي، يمكنها المساعدة في إنشاء اتجاهات مفصّلة أكثر دقة أو توفير معلومات حول موقع جغرافي معيّن.
ملخّص
- اكتشِف الجانب الذي في أعلى الجهاز وكيفية تدوير الجهاز.
- تعرَّف على حالات الاستجابة لأحداث الحركة والاتجاه وكيفية الاستجابة لها.
أي النهاية انتهى؟
لاستخدام البيانات التي يعرضها كل من اتجاه الجهاز وأحداث الحركة، من المهم أن تفهم القيم المقدمة.
إطار إحداثيات الأرض
يتمّ محاذاة إطار إحداثيات الأرض، الموضّح بالقيم X وY وZ،
استنادًا إلى الجاذبية والاتجاه المغناطيسي العادي.
| نظام الإحداثيات | |
|---|---|
X |
يمثل الاتجاه من الشرق إلى الغرب (حيث يكون الشرق موجبًا). |
Y |
يمثّل الاتجاه من الشمال إلى الجنوب (حيث يكون الشمال موجبًا). |
Z |
يمثل الاتجاه من أعلى لأسفل، عمودي على الأرض (حيث يكون الاتجاه لأعلى موجبًا). |
إطار إحداثيات الجهاز
تتم محاذاة الإطار الإحداثي للجهاز الموضح باستخدام القيم x وy وz بناءً على وسط الجهاز.
| نظام الإحداثيات | |
|---|---|
X |
في مستوى الشاشة، تكون موجبة إلى اليمين. |
Y |
في مستوى الشاشة، بشكل موجب نحو الأعلى. |
Z |
عمودي على الشاشة أو لوحة المفاتيح، موجب يمتد بعيدًا. |
على الهاتف أو الجهاز اللوحي، يستند اتجاه الجهاز إلى اتجاه الشاشة المعتاد. بالنسبة إلى الهواتف والأجهزة اللوحية، يعتمد ذلك على الجهاز الذي يكون في الوضع العمودي. بالنسبة لأجهزة الكمبيوتر المكتبية أو المحمولة، يتم مراعاة الاتجاه في ما يتعلق بلوحة المفاتيح.
بيانات التناوب
يتم عرض بيانات التدوير على شكل زاوية أولر تمثل عدد درجات الفرق بين إطار إحداثيات الجهاز وإطار إحداثيات الأرض.
إصدار أولي
الدوران حول محور z وتكون قيمة alpha تساوي 0 درجة عندما يكون الجزء العلوي من
الجهاز موجَّهًا إلى الشمال مباشرةً. تزيد قيمة alpha عند تدوير الجهاز عكس عقارب الساعة.
إصدار تجريبي
الدوران حول محور x وتكون قيمة beta تساوي 0 درجة عندما يكون أعلى الجهاز
وأسفله متساويين عن سطح الأرض. تزداد القيمة كلما اتجاه الجزء العلوي من الجهاز إلى سطح الأرض.
غاما
الدوران حول المحور y. تكون قيمة gamma هي 0° عندما تكون الحافتان اليسرى
والأيمن للجهاز متساويتين عن سطح الأرض. تزداد القيمة كلما اتجاه الجانب الأيمن نحو سطح الأرض.
اتجاه الجهاز
يعرض حدث "اتجاه الجهاز" بيانات التدوير، بما في ذلك مقدار انحناء الجهاز من الأمام إلى الخلف ومن الجانب إلى الجانب، وإذا كان الهاتف أو الكمبيوتر المحمول يحتوي على بوصلة، يعرض الاتجاه الذي يواجهه الجهاز.
استخدِم هذه الميزة باعتدال.
اختبار مدى توفّر الدعم
عدم تعديل واجهة المستخدم في كل حدث اتجاه، وبدلاً من ذلك، عليك المزامنة مع "requestAnimationFrame"
حالات استخدام أحداث اتجاه الجهاز
هناك العديد من الاستخدامات لأحداث اتجاه الجهاز. تشمل الأمثلة ما يلي:
- تعديل خريطة أثناء تنقّل المستخدم
- تعديلات دقيقة على واجهة المستخدم، مثل إضافة تأثيرات التمويه
- ويمكن استخدامها مع رصد الموقع الجغرافي لتوفير اتجاهات مفصّلة للتنقّل.
التحقّق من توفّر الدعم والاستماع إلى الأحداث
للاستماع إلى "DeviceOrientationEvent"، يُرجى التحقّق أولاً لمعرفة ما إذا كان المتصفّح يتيح عرض الأحداث. بعد ذلك، يمكنك إرفاق أداة معالجة أحداث بعنصر window الذي يعالج أحداث deviceorientation.
if (window.DeviceOrientationEvent) {
window.addEventListener('deviceorientation', deviceOrientationHandler, false);
document.getElementById('doeSupported').innerText = 'Supported!';
}
التعامل مع أحداث اتجاه الجهاز
يتم تنشيط حدث اتجاه الجهاز عند تحرك الجهاز أو تغيير اتجاهه. ويعرض بيانات عن الفرق بين الجهاز في موقعه الحالي بالنسبة إلى إطار إحداثيات الأرض.
يعرض الحدث عادةً ثلاث سمات: alpha،
beta، وgamma. في Mobile Safari، يتم عرض مَعلمة إضافية
webkitCompassHeading
مع عنوان البوصلة.
حركة الجهاز
يعرض حدث اتجاه الجهاز بيانات التدوير، التي تتضمن مدى ميل الجهاز من الأمام إلى الخلف، ومن جانب إلى آخر، وإذا كان الهاتف أو الكمبيوتر المحمول بها بوصلة، فإن الاتجاه المواجه للجهاز.
استخدِم حركة الجهاز عندما تكون الحركة الحالية للجهاز مطلوبة.
تبلغ درجة الحرارة rotationRate درجة مئوية/ثانية.
وتبلغ درجة الحرارة acceleration وaccelerationWithGravity بالمتر/الثانية2.
انتبِه إلى الاختلافات بين عمليات تنفيذ المتصفِّح.
حالات استخدام أحداث حركة الجهاز
هناك العديد من الاستخدامات لأحداث حركة الجهاز. وتشمل الأمثلة ما يلي:
- إيماءة الهز لإعادة تحميل البيانات
- في الألعاب، لجعل الشخصيات تقفز أو تتحرك
- لتطبيقات الصحة واللياقة البدنية
التحقّق من توفّر الدعم والاستماع إلى الأحداث
للاستماع إلى DeviceMotionEvent، يُرجى التحقّق أولاً لمعرفة ما إذا كانت الأحداث متوافقة في المتصفّح. بعد ذلك، يمكنك إرفاق أداة معالجة حدث بالكائن window الذي يرصد أحداث devicemotion.
if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion', deviceMotionHandler);
setTimeout(stopJump, 3 * 1000);
}
التعامل مع أحداث حركة الجهاز
يتم إطلاق حدث حركة الجهاز على فاصل زمني منتظم ويعرض بيانات عن دوران الجهاز (بالمتر/الثانية) وتسارعه (بالمتر/الثانية2) في تلك اللحظة الزمنية. بعض الأجهزة لا تحتوي على الأجهزة اللازمة لاستبعاد تأثير الجاذبية.
ويعرض الحدث أربع سمات، وهي accelerationIncludingGravity وacceleration التي تستبعد تأثيرات الجاذبية وrotationRate وinterval.
على سبيل المثال، لنلقِ نظرة على هاتف موضوع على طاولة مسطَّحة، مع توجيه شاشته إلى الأعلى.
| الحالة | تدوير | التسارع (م/ث2) | التسارع مع الجاذبية (م/ث2) |
|---|---|---|---|
| لا يتم نقل البيانات | [0, 0, 0] | [0, 0, 0] | [0، 0، 9.8] |
| التحرك للأعلى باتجاه السماء | [0, 0, 0] | [0, 0, 5] | [0، 0، 14.81] |
| الانتقال إلى اليمين فقط | [0, 0, 0] | [3، 0، 0] | [3, 0, 9.81] |
| تحريك لأعلى وإلى اليمين | [0, 0, 0] | [5, 0, 5] | [5, 0, 14.81] |
في المقابل، إذا تم حمل الهاتف بحيث تكون الشاشة عمودية على سطح الأرض وكانت مرئية للمشاهد مباشرةً:
| الحالة | تدوير | التسارع (م/ث2) | التسارع مع الجاذبية (م/ث2) |
|---|---|---|---|
| لا يتم نقل البيانات | [0, 0, 0] | [0، 0، 0] | [0, 9.81, 0] |
| التحرّك باتجاه السماء | [0, 0, 0] | [0, 5, 0] | [0, 14.81, 0] |
| الانتقال إلى اليمين فقط | [0, 0, 0] | [3، 0، 0] | [3، 9.81، 0] |
| تحريك لأعلى وإلى اليمين | [0, 0, 0] | [5، 5، 0] | [5، 14.81، 0] |
مثال: حساب أقصى تسارع لجسم معيّن
إحدى طرق استخدام أحداث حركة الجهاز هي احتساب الحد الأقصى للتسارع للجسم. على سبيل المثال، ما الحد الأقصى لتسارع الشخص الذي يقفز؟
if (evt.acceleration.x > jumpMax.x) {
jumpMax.x = evt.acceleration.x;
}
if (evt.acceleration.y > jumpMax.y) {
jumpMax.y = evt.acceleration.y;
}
if (evt.acceleration.z > jumpMax.z) {
jumpMax.z = evt.acceleration.z;
}
بعد النقر على زر Go! ، يُطلب من المستخدم القفز. خلال ذلك الوقت، تخزِّن الصفحة قيم التسارع القصوى (والدنيا)، وبعد القفزة، تُعلم المستخدم بأقصى تسارع.