জাভাস্ক্রিপ্ট থেকে অ্যাকিলারোমিটার / জাইরোস্কোপ ডেটা কীভাবে অ্যাক্সেস করবেন?

Question

আমি সম্প্রতি কয়েকটি ওয়েবসাইট পেয়েছি যা আমার ল্যাপটপে অ্যাক্সিলোমিটার বা জাইরোস্কোপে অ্যাক্সেস করেছে বলে মনে হচ্ছে, অভিমুখীকরণ বা গতিবিধির পরিবর্তনগুলি সনাক্ত করে।

এটি কিভাবে হয়? আমি কি windowঅবজেক্টটিতে কোনও ধরণের ইভেন্টে সাবস্ক্রাইব করব ?

কোন ডিভাইসে (ল্যাপটপ, মোবাইল ফোন, ট্যাবলেট) এটি কাজ করে?

---

^{এনবি : আমি ইতিমধ্যে এই প্রশ্নের উত্তরটি (এর একটি অংশ) ইতিমধ্যে জানি এবং আমি এখনই এটি পোস্ট করতে চলেছি। আমি এখানে প্রশ্নটি পোস্ট করার কারণটি হ'ল জাভাস্ক্রিপ্টে (কিছু নির্দিষ্ট ডিভাইসে) অ্যাক্সিলেরোমিটার ডেটা পাওয়া যায় এবং সম্প্রদায়কে এই বিষয়টিতে নতুন অনুসন্ধান পোস্ট করার জন্য চ্যালেঞ্জ জানাতে everyone বর্তমানে, এই বৈশিষ্ট্যগুলির প্রায় কোনও ডকুমেন্টেশন নেই বলে মনে হয়।}

Comments

দুর্দান্ত চেষ্টা, অনেক অনেক ধন্যবাদ। আপনি কি মনে করেন যে 3 বছর পরে উত্তরটির কোনও আপডেট দরকার?

— বারটেক বানাচেউইচজ

@ বার্তেকবানাচিউইচজ আমাকে এই সম্পর্কে আহ্বান জানাতে ধন্যবাদ। আমি উত্তরটি "সম্প্রদায় উইকিতে" স্থানান্তর করব, এই আশা করে যে আরও আধুনিক যুগের জ্ঞান থাকা কেউ শিল্পের বর্তমান অবস্থা প্রতিফলিত করার জন্য এটি আপডেট করবে।

— জার্ন শো-রোড

এই অপারেশনের ব্যবহারকারীর সম্মতি প্রয়োজন কিনা তা আমি খুঁজে পেলাম না। আপনার প্রশ্নের সাথে এটি পুরোপুরি ফিট হওয়ার কারণে আমি কোনও নতুন প্রশ্ন করতে চাইনি। আমরা কি এখানে এটি যুক্ত করতে পারি? কেউ কি জানেন যে এর সুস্পষ্ট সম্মতি প্রয়োজন? এটি কি সমস্ত ব্রাউজার এবং সমস্ত মোবাইল ওএসে রয়েছে?

— রৌপ্য

Answer 1

2019+ এ করার উপায় হল DeviceOrientationAPI ব্যবহার করা । এটি ডেস্কটপ এবং মোবাইলের বেশিরভাগ আধুনিক ব্রাউজারে কাজ করে।

window.addEventListener("deviceorientation", handleOrientation, true);

আপনার ইভেন্ট শ্রোতাদের নিবন্ধ করার পরে (এক্ষেত্রে হ্যান্ডেল ওরিয়েন্টেশন () নামে পরিচিত একটি জাভাস্ক্রিপ্ট ফাংশন) আপনার শ্রোতার ফাংশন পর্যায়ক্রমে আপডেট ওরিয়েন্টেশন ডেটার সাথে কল করা হয়।

ওরিয়েন্টেশন ইভেন্টে চারটি মান রয়েছে:

• DeviceOrientationEvent.absolute
• DeviceOrientationEvent.alpha
• DeviceOrientationEvent.beta
• DeviceOrientationEvent.gamma

ইভেন্ট হ্যান্ডলার ফাংশনটি এরকম কিছু দেখতে পারে:

function handleOrientation(event) {
  var absolute = event.absolute;
  var alpha    = event.alpha;
  var beta     = event.beta;
  var gamma    = event.gamma;
  // Do stuff with the new orientation data
}

Answer 2

বর্তমানে তিনটি স্বতন্ত্র ঘটনা রয়েছে যা ক্লায়েন্ট ডিভাইসগুলি চললে ট্রিগার হতে পারে বা নাও হতে পারে। এর মধ্যে দুটি মনোভাব এবং সর্বশেষ গতিতে মনোনিবেশ করে :

• ondeviceorientationক্রোমের ডেস্কটপ সংস্করণে কাজ করার জন্য পরিচিত এবং বেশিরভাগ অ্যাপল ল্যাপটপের কাছে এটি কাজ করার জন্য প্রয়োজনীয় হার্ডওয়্যার রয়েছে বলে মনে হয়। এটি আইওএস ৪.২ সহ আইফোন ৪ এ মোবাইল সাফারিতেও কাজ করে। ইভেন্ট হ্যান্ডলার ফাংশন, আপনি অ্যাক্সেস করতে পারেন alpha, beta, gammaফাংশন শুধুমাত্র আর্গুমেন্ট হিসাবে সরবরাহকৃত ঘটনা ডেটার উপর মান।

• onmozorientationফায়ারফক্স 3.6 এবং আরও নতুন সমর্থিত। আবার এটি বেশিরভাগ অ্যাপল ল্যাপটপে কাজ করার জন্য পরিচিত, তবে উইন্ডোজ বা লিনাক্স মেশিনগুলিতে অ্যাকসিলোমিটার সহ কাজ করতে পারে। ইভেন্ট হ্যান্ডলার ফাংশন, জন্য চেহারা x, y, zঘটনা ডেটার উপর ক্ষেত্র প্রথম আর্গুমেন্ট হিসাবে সরবরাহকৃত।

• ondevicemotionআইফোন 3GS + 4 এবং আইপ্যাড (আইওএস 4.2 সহ উভয়) এ কাজ করার জন্য পরিচিত এবং ক্লায়েন্ট ডিভাইসের বর্তমান ত্বরণ সম্পর্কিত ডেটা সরবরাহ করে। হ্যান্ডলার ফাংশন আছে প্রেরণ করা ইভেন্ট ডেটা accelerationএবং accelerationIncludingGravity, যা উভয় প্রতিটি অক্ষের জন্য তিনটি ক্ষেত্র আছে: x, y,z

"ভূমিকম্প সনাক্তকরণ" স্যাম্পল ওয়েবসাইটটি ifকোন ইভেন্টটি সংযুক্ত করতে হবে তা কিছুটা বিবৃতি দিয়ে কিছুটা ব্যবহার করে (কিছুটা অগ্রাধিকারযুক্ত ক্রমে) এবং প্রাপ্ত তথ্যকে একটি সাধারণ tiltফাংশনে পাস করে :

if (window.DeviceOrientationEvent) {
    window.addEventListener("deviceorientation", function () {
        tilt([event.beta, event.gamma]);
    }, true);
} else if (window.DeviceMotionEvent) {
    window.addEventListener('devicemotion', function () {
        tilt([event.acceleration.x * 2, event.acceleration.y * 2]);
    }, true);
} else {
    window.addEventListener("MozOrientation", function () {
        tilt([orientation.x * 50, orientation.y * 50]);
    }, true);
}

ধ্রুব কারণের 2 এবং 50 "সারিবদ্ধ" প্রথম থেকে যারা সঙ্গে দুই আধুনিক ঘটনা থেকে রিডিং করতে ব্যবহার করা হয়, কিন্তু এই হয় কোন মানে সুনির্দিষ্ট উপস্থাপনা। এই সহজ "খেলনা" প্রকল্পের জন্য এটি ঠিক ঠিক কাজ করে, তবে যদি আপনাকে আরও কিছু গুরুতর কিছু করার জন্য ডেটা ব্যবহার করতে হয় তবে আপনাকে বিভিন্ন ইভেন্টে প্রদত্ত মানগুলির ইউনিটগুলির সাথে পরিচিত হতে হবে এবং তাদের সাথে শ্রদ্ধার সাথে আচরণ করতে হবে :)

Comments

কখনও কখনও একটি উত্তর শুধু এটি পেরেক!

— স্কট এভারেন্ডেন

যদি কারও অবাক হয় - অনডভাইসেমোশন ফায়ারফক্স ৮.০ এর জন্য কাজ করে তবে ভুলভাবে স্কেল করা হয়েছে (0-9), তবে এটি পরবর্তী সংস্করণগুলিতে (10.0) স্থির করা হয়েছে বলে মনে হয়। এগুলির মধ্যে কোনও অপেরা মোবাইলে কাজ করে না এবং সমস্ত মানক ডিফল্ট নোকিয়া এন 9 ব্রাউজারে দুর্দান্ত কাজ করে।

— নাক্স

মোজরিয়েন্টেশন ইভেন্টটি ফায়ারফক্স in এ অপ্রচলিত হিসাবে সরানো হয়েছিল তাই এখন তারা সকলেই মানকযুক্ত এপিআই ব্যবহার করছে।

— ক্রিস মরগান

এটি ফায়ারফক্স 30 তে কাজ করবে বলে মনে হচ্ছে না, যেমনটি এই ফিডলে দেখানো হয়েছে । :(

— সুইডেন

sidenote : Plax.js , যা গিথুবের 404 এবং 500 পৃষ্ঠায় ব্যবহৃত হয়, অনডভাইসরিয়েন্টেশন ব্যবহার করে ।

— যোশ

Answer 3

অন্য পোস্টে দুর্দান্ত ব্যাখ্যায় কোনও মন্তব্য যুক্ত করতে পারেন না তবে উল্লেখ করতে চেয়েছিলেন যে এখানে একটি দুর্দান্ত ডকুমেন্টেশন উত্স পাওয়া যাবে ।

এটির মতো অ্যাক্সিলোমিটারের জন্য ইভেন্ট ফাংশনটি নিবন্ধিত করার জন্য এটি যথেষ্ট:

if(window.DeviceMotionEvent){
  window.addEventListener("devicemotion", motion, false);
}else{
  console.log("DeviceMotionEvent is not supported");
}

হ্যান্ডলারের সাথে:

function motion(event){
  console.log("Accelerometer: "
    + event.accelerationIncludingGravity.x + ", "
    + event.accelerationIncludingGravity.y + ", "
    + event.accelerationIncludingGravity.z
  );
}

এবং চৌম্বকীয় জন্য নিম্নলিখিত ইভেন্ট হ্যান্ডলার নিবন্ধিত করতে হবে:

if(window.DeviceOrientationEvent){
  window.addEventListener("deviceorientation", orientation, false);
}else{
  console.log("DeviceOrientationEvent is not supported");
}

একটি হ্যান্ডলারের সাথে:

function orientation(event){
  console.log("Magnetometer: "
    + event.alpha + ", "
    + event.beta + ", "
    + event.gamma
  );
}

গাইরোস্কোপের জন্য মোশন ইভেন্টে ক্ষেত্রগুলি নির্দিষ্ট করা আছে তবে এটি সর্বজনীনভাবে সমর্থিত বলে মনে হয় না (যেমন এটি স্যামসাং গ্যালাক্সি নোটে কাজ করে না)।

গিটহাবটিতে একটি সাধারণ ওয়ার্কিং কোড রয়েছে

Answer 4

এখানে ব্যবহারযোগ্য ফুলব্যাক: https://developer.mozilla.org/en-US/docs/Web/Events/MozOrientation

function orientationhandler(evt){


  // For FF3.6+
  if (!evt.gamma && !evt.beta) {
    evt.gamma = -(evt.x * (180 / Math.PI));
    evt.beta = -(evt.y * (180 / Math.PI));
  }

  // use evt.gamma, evt.beta, and evt.alpha 
  // according to dev.w3.org/geo/api/spec-source-orientation


}

window.addEventListener('deviceorientation',  orientationhandler, false);
window.addEventListener('MozOrientation',     orientationhandler, false);