اتجاه الجهاز والحركة

Pete LePage

توفّر أحداث حركة الجهاز واتجاهه إمكانية الوصول إلى أدوات قياس السرعة والجيروسكوب والبوصلة المدمجة في الأجهزة الجوّالة.

يمكن استخدام هذه الأحداث لأغراض متعددة، مثل التحكّم في اتجاه أو سلوك شخصية في الألعاب. وعند استخدامها مع ميزة رصد الموقع الجغرافي، يمكن أن تساعد في إنشاء ميزة التنقّل بالاتّباع الدقيق للخطوات أو تقديم معلومات عن موقع جغرافي معيّن.

ملخّص

• رصد الجهة العلوية من الجهاز واتجاه دورانه
• تعرَّف على حالات الاستجابة لأحداث الحركة والاتجاه وكيفية الاستجابة لها.

أيّهما الجهة العلوية؟

لاستخدام البيانات التي يعرضها حدثا اتجاه الجهاز والحركة، من المهم فهم القيم المقدَّمة.

إطار إحداثيات الأرض

يتمّ محاذاة إطار إحداثيات الأرض، الموضّح بالقيم X وY وZ، استنادًا إلى الجاذبية والاتجاه المغناطيسي العادي.

إطار إحداثيات الجهاز

يتمّ محاذاة إطار إحداثيات الجهاز، الموضّح بالقيم x وy وz، استنادًا إلى مركز الجهاز.

على الهاتف أو الجهاز اللوحي، يستند اتجاه الجهاز إلى اتجاه الشاشة المعتاد. بالنسبة إلى الهواتف والأجهزة اللوحية، يستند ذلك إلى وضع الجهاز عموديًا. بالنسبة إلى أجهزة الكمبيوتر المكتبي أو المحمول، يتم تحديد الاتجاه بالاستناد إلى لوحة المفاتيح.

بيانات التناوب

يتم عرض بيانات الدوران على شكل زاوية أويلر، التي تمثّل عدد درجات الفرق بين إطار إحداثيات الجهاز وإطار إحداثيات الأرض.

إصدار أولي

الدوران حول محور z تكون قيمة alpha هي 0° عندما يكون الجزء العلوي من الجهاز موجهًا نحو الشمال مباشرةً. عند تدوير الجهاز عكس عقارب الساعة، تزداد قيمة alpha.

إصدار تجريبي

الدوران حول محور x تكون قيمة beta هي 0° عندما يكون الجزء العلوي والسفلي من الجهاز على مسافة متساوية من سطح الأرض. تزداد القيمة عندما يتم إمالة الجزء العلوي من الجهاز باتجاه سطح الأرض.

غاما

الدوران حول المحور الصادي تكون قيمة 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 بالمتر في الثانية². انتبه إلى الاختلافات بين عمليات تنفيذ المتصفّحات.

حالات استخدام أحداث حركة الجهاز

هناك عدة استخدامات لأحداث حركة الجهاز. تشمل الأمثلة ما يلي:

• إيماءة الهز لإعادة تحميل البيانات
• في الألعاب، لجعل الشخصيات تقفز أو تتحرك
• تطبيقات الصحة واللياقة البدنية

التحقّق من توفّر الدعم والاستماع إلى الأحداث

للاستماع إلى DeviceMotionEvent، تحقّق أولاً ممّا إذا كانت الأحداث متوفرة في المتصفّح. بعد ذلك، يمكنك إرفاق أداة معالجة أحداث بـ window العنصر الذي يستمع إلى أحداث devicemotion.

if (window.DeviceMotionEvent) {
  window.addEventListener('devicemotion', deviceMotionHandler);
  setTimeout(stopJump, 3 * 1000);
}

التعامل مع أحداث حركات الجهاز

يتم تشغيل حدث حركة الجهاز على فترات زمنية منتظمة ويعرض بيانات عن التدوير (بالدرجات في الثانية) والتسارع (بالمتر في الثانية²) للجهاز في تلك اللحظة الزمنية. لا تتضمّن بعض الأجهزة المكونات اللازمة لاستبعاد تأثير الجاذبية.

يعرض الحدث أربع سمات، accelerationIncludingGravity، acceleration، والتي تستبعد تأثيرات الجاذبية وrotationRate وinterval.

على سبيل المثال، لنلقِ نظرة على هاتف مُستلقٍ على طاولة مسطحة مع توجيه الشاشة للأعلى.

في المقابل، إذا تم حمل الهاتف بحيث تكون الشاشة عمودية على سطح الأرض وكانت مرئية للمشاهد مباشرةً:

مثال: حساب أقصى تسارع لجسم معيّن

إحدى طرق استخدام أحداث حركة الجهاز هي احتساب الحد الأقصى للتسارع للجسم. على سبيل المثال، ما هو الحد الأقصى لتسارع شخصٍ يقفز؟

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;
}

بعد النقر على زر "ابدأ"، يُطلب من المستخدم القفز. خلال هذه الفترة، تخزِّن المحاولة القصوى (والدنيا) لقيم التسارع، وبعد القفزة، تُعلم المستخدم بأقصى تسارع.

ملاحظات