वेब ऐप्लिकेशन अब पॉइंटर इवेंट कैप्चर करते समय, माउस की रफ़्तार बढ़ाने की सुविधा बंद कर सकते हैं.
माउस या ट्रैकपैड का इस्तेमाल करके, स्क्रीन पर कर्सर को तेज़ी से घुमाने की सुविधा को ऐक्सेलरेटेड मूवमेंट कहते हैं. इस मोड में कर्सर को धीरे-धीरे आगे-पीछे किया जा सकता है. साथ ही, कर्सर को तेज़ी से एक बार में पूरी स्क्रीन पर ले जाया जा सकता है. खास तौर पर, माउस को जिस दूरी तक ले जाया जाता है उसी दूरी पर स्क्रीन पर मौजूद पॉइंटर भी पहुंच जाता है. हालांकि, अगर माउस को तेज़ी से ले जाया जाता है, तो स्क्रीन पर मौजूद पॉइंटर भी तेज़ी से आगे बढ़ता है.
ऑपरेटिंग सिस्टम, माउस की रफ़्तार बढ़ाने की सुविधा को डिफ़ॉल्ट रूप से चालू करते हैं. आम तौर पर, पहले पक्ष के दर्शक के नज़रिए वाले कुछ गेम, जैसे कि फ़र्स्ट-पर्सन शूटर (एफ़पीएस) के लिए, माउस के इनपुट डेटा का इस्तेमाल किया जाता है. इससे, कैमरे के रोटेशन को तेज़ी से बदले बिना कंट्रोल किया जा सकता है. एक ही तरह की गति, चाहे वह धीमी हो या तेज़, एक ही तरह के रोटेशन का नतीजा देती है. इससे, पेशेवर गेमर्स को बेहतर गेमिंग अनुभव मिलता है और गेम में होने वाली गतिविधियां ज़्यादा सटीक तरीके से दिखाई जाती हैं.
Chrome 88 की शुरुआत से, अपडेट किए गए Pointer Lock API की मदद से, वेब ऐप्लिकेशन तेज़ी से होने वाले और तेज़ी से होने वाले माउस मूवमेंट के डेटा के बीच स्विच कर सकते हैं.
Google Stadia और Nvidia GeForce Now जैसे वेब पर आधारित गेमिंग प्लैटफ़ॉर्म, पहले से ही एफ़पीएस गेमर का ध्यान खींचने के लिए इन नई सुविधाओं का इस्तेमाल कर रहे हैं.
एपीआई का इस्तेमाल करना
पॉइंटर लॉक का अनुरोध करना
पॉइंटर लॉक, कैननिकल शब्द है. इसका इस्तेमाल तब किया जाता है, जब कोई डेस्कटॉप ऐप्लिकेशन, पॉइंटर आइकॉन को छिपा देता है और माउस की गति को किसी और चीज़ के लिए इस्तेमाल करता है. जैसे, 3D वर्ल्ड में चारों ओर देखना.
mousemove
दस्तावेज़ इवेंट में मौजूद movementX
और movementY
एट्रिब्यूट से यह पता चलता है कि आखिरी बार मूव होने के बाद से माउस पॉइंटर कितना मूव हुआ. हालांकि, जब कर्सर वेब पेज से बाहर चला जाता है, तो ये अपडेट नहीं होते.
document.addEventListener("mousemove", (event) => {
console.log(`movementX: ${event.movementX} movementY: ${event.movementY}`);
});
माउस पॉइंटर को कैप्चर करने या पॉइंटर लॉक का अनुरोध करने पर, आपको पॉइंटर के बाहर जाने की चिंता नहीं करनी पड़ती. यह सुविधा खास तौर पर, ज़्यादा दिलचस्पी जगाने वाले वेब गेम के लिए मददगार है. जब पॉइंटर लॉक होता है, तो सभी माउस इवेंट, पॉइंटर लॉक के टारगेट एलिमेंट पर जाते हैं.
पॉइंटर लॉक का अनुरोध करने के लिए, टारगेट एलिमेंट पर requestPointerLock()
को कॉल करें. साथ ही, पॉइंटर लॉक में होने वाले बदलावों को मॉनिटर करने के लिए, pointerlockchange
और pointerlockerror
इवेंट सुनें.
const myTargetElement = document.body;
// Call this function to request a pointer lock.
function requestPointerLock() {
myTargetElement.requestPointerLock();
}
document.addEventListener("pointerlockchange", () => {
if (document.pointerLockElement) {
console.log(`pointer is locked on ${document.pointerLockElement}`);
} else {
console.log("pointer is unlocked");
}
});
document.addEventListener("pointerlockerror", () => {
console.log("pointer lock error");
});
माउस की रफ़्तार बढ़ाने की सुविधा बंद करें
माउस एक्सेलरेटर के लिए ओएस-लेवल अडजस्टमेंट को बंद करने और माउस इनपुट को ऐक्सेस करने के लिए, requestPointerLock()
को { unadjustedMovement: true }
के साथ कॉल करें.
इस तरह, mousemove
इवेंट से मिले माउस मूवमेंट के डेटा में, पॉइंटर लॉक होने पर माउस के ऐक्सेलरेशन का डेटा शामिल नहीं होगा.
requestPointerLock()
से मिले, नए प्रॉमिस का इस्तेमाल करके देखें कि अनुरोध पूरा हुआ या नहीं.
function requestPointerLockWithUnadjustedMovement() {
const promise = myTargetElement.requestPointerLock({
unadjustedMovement: true,
});
if (!promise) {
console.log("disabling mouse acceleration is not supported");
return;
}
return promise
.then(() => console.log("pointer is locked"))
.catch((error) => {
if (error.name === "NotSupportedError") {
// Some platforms may not support unadjusted movement.
// You can request again a regular pointer lock.
return myTargetElement.requestPointerLock();
}
});
}
पॉइंटर लॉक को हटाए बिना, माउस की उस गतिविधि के डेटा के बीच टॉगल किया जा सकता है जिस पर तेज़ी से क्लिक किया जा सकता है और नहीं. अपने हिसाब से विकल्प चुनकर, पॉइंटर लॉक का फिर से अनुरोध करें. अगर वह अनुरोध पूरा नहीं होता है, तो ओरिजनल लॉक लागू रहेगा और मिलता-जुलता प्रॉमिस अस्वीकार कर दिया जाएगा. बदलाव के अनुरोध के पूरा न होने पर, कोई भी पॉइंटर लॉक इवेंट ट्रिगर नहीं होगा.
ब्राउज़र समर्थन
Pointer Lock API सभी ब्राउज़र पर काम करता है. हालांकि, अक्टूबर 2020 तक, सिर्फ़ Chromium पर आधारित ब्राउज़र (जैसे, Chrome, Edge वगैरह) में, माउस ऐक्सेलरेशन के लिए ऑपरेटिंग सिस्टम के लेवल पर किए जाने वाले अडजस्टमेंट को बंद करने की सुविधा काम करती है. अपडेट के लिए, एमडीएन की ब्राउज़र के साथ काम करने की सुविधा टेबल देखें.
ऑपरेटिंग सिस्टम से जुड़ी सहायता
माउस ऐक्सेलरेशन के लिए, ओएस-लेवल अडजस्टमेंट की सुविधा बंद की जा सकती है. यह सुविधा ChromeOS, macOS Catalina 10.15.1, और Windows पर काम करती है. Linux इसके हिसाब से चलेगा.
नमूना
Glitch पर सैंपल चलाकर, पॉइंटर लॉक एपीआई का इस्तेमाल किया जा सकता है. सोर्स कोड को देखना न भूलें.
मददगार लिंक
- पूरी जानकारी देने वाला वीडियो
- स्पेसिफ़िकेशन पीआर
- GitHub का डेटा स्टोर करने की जगह
- ChromeStatus की एंट्री
- Chrome ट्रैकिंग से जुड़ी गड़बड़ी
- शिपिंग की इच्छा
- मोज़िला की स्थिति
- WebKit की स्थिति
धन्यवाद
इस लेख की समीक्षा करने के लिए, जेम्स होलीयर, थॉमस स्टाइनर, जो मेडली, केस बेस्केस, और विन्सेंट स्कीब का धन्यवाद.