कैनवास पर आकारों का स्क्रीन पाठ पठन योग्य विवरण बनाता है।
gridOutput()
वेब पेज में एक सामान्य विवरण, आकारों का तालिका, और आकारों की सूची जोड़ता है। सामान्य विवरण में कैनवास का आकार, कैनवास का रंग, और आकारों की संख्या शामिल होती है। उदाहरण के लिए, gray canvas, 100 by 100 pixels, contains 2 shapes: 1 circle 1 square
।
gridOutput()
अपनी आकारों की तालिका का उपयोग ग्रिड के रूप में करता है। ग्रिड में प्रत्येक आकार को एक सेल में रखा जाता है जिसकी पंक्ति और स्तंभ उस आकार के स्थान को संदर्भित करते हैं। ग्रिड सेल्स उस स्थान पर आकार के रंग और प्रकार का विवरण करती हैं। उदाहरण के लिए, red circle
। इन विवरणों को व्यक्तिगत रूप से चुनकर अधिक विवरण प्राप्त किया जा सकता है। यह textOutput() से अलग है, जो अपनी तालिका का उपयोग सूची के रूप में करता है।
तालिका के पीछे आकारों की एक सूची होती है। सूची में प्रत्येक आकार की रंग, प्रकार, स्थान, और क्षेत्रफल का विवरण होता है। उदाहरण के लिए, red circle, location = middle, area = 3 %
।
display
पैरामीटर वैकल्पिक है। यह निर्धारित करता है कि विवरण कैसे प्रदर्शित किया जाएगा। यदि LABEL
पारित किया जाता है, जैसे gridOutput(LABEL)
, तो विवरण कैनवास के बगल में एक div तत्व में दिखाई देगा। LABEL
का उपयोग स्क्रीन पाठ पठन के लिए अप्रयोगी नकलियों को बनाता है। विकास के दौरान केवल LABEL
का उपयोग करें। यदि FALLBACK
पारित किया जाता है, जैसे gridOutput(FALLBACK)
, तो विवरण केवल स्क्रीन पाठ पठन के लिए ही दिखाई देगा। यह डिफ़ॉल्ट मोड है।
और अधिक जानने के लिए Writing accessible canvas descriptions पढ़ें।
उदाहरण
सिंटैक्स
gridOutput([display])
पैरामीटर्स
या तो FALLBACK या LABEL.
संबंधित संदर्भ
cursor
कर्सर की दिखावट को बदलता है। पहला पैरामीटर, type, कर्सर के प्रकार को प्रदर्शित करता है। अंदरूनी विकल्प हैं ARROW, CROSS, HAND, MOVE, TEXT, और WAIT। cursor() भी मान्यतानुसार स्टैंडर्ड CSS कर्सर गुणों को स्ट्रिंग के रूप में पारित करता है: 'help', 'wait', 'crosshair', 'not-allowed', 'zoom-in', और 'grab'। यदि एक छवि के पथ को पास किया जाता है, जैसे कि cursor('/assets/target.png'), तो छवि को कर्सर के रूप में उपयोग किया जाएगा। छवियों का प्रारूप .cur, .gif, .jpg, .jpeg, या .png होना चाहिए और यह अधिकतम 32x32 पिक्सेल के बड़े होने चाहिए। पैरामीटर x और y वैकल्पिक हैं। यदि कर्सर के लिए एक छवि का उपयोग किया जाता है, तो x और y छवि के भीतर इंगित की गई स्थान को सेट करते हैं। ये डिफ़ॉल्ट रूप से दोनों 0 होते हैं, ताकि कर्सर छवि के शीर्ष-बाएं कोने को इंगित करें। x और y को छवि की चौड़ाई और ऊँचाई से कम होना चाहिए। .
deltaTime
एक Number वेरिएबल जो अंतिम फ्रेम खींचने में कितना समय लगा वह ट्रैक करता है। deltaTime में वह समय होता है जो draw() ने पिछले फ्रेम के दौरान क्रियान्वित करने में लिया। यह भौतिकीय को नकल करने के लिए उपयोगी है। .
describe
कैनवास का एक स्क्रीन रीडर-एक्सेस करने योग्य विवरण बनाता है। पहला पैरामीटर, text, कैनवास का विवरण है। दूसरा पैरामीटर, display, ऐच्छिक है। यह निर्धारित करता है कि विवरण कैसे प्रदर्शित किया जाएगा। यदि LABEL पास किया जाता है, जैसे describe('A description.', LABEL), तो विवरण कैनवास के बगल में एक डिव तत्व में दिखाई जाएगा। यदि FALLBACK पास किया जाता है, जैसे describe('A description.', FALLBACK), तो विवरण केवल स्क्रीन रीडर्स को ही दिखाई जाएगी। यह डिफ़ॉल्ट मोड है। और जानने के लिए एक्सेस करने योग्य कैनवास विवरण लेखन करें। .
describeElement
कैनवास में तत्वों का एक स्क्रीन रीडर-पहुंच योग्य विवरण बनाता है। तत्व वह आकार होते हैं या आकारों के समूह होते हैं जो साथ में अर्थ बनाते हैं। उदाहरण के लिए, कुछ ओवरलैपिंग वृत्तों से एक "आंख" तत्व बना सकता है। पहला पैरामीटर, name, तत्व का नाम है। दूसरा पैरामीटर, text, तत्व का विवरण है। तीसरा पैरामीटर, display, वैकल्पिक है। यह निर्धारित करता है कि विवरण कैसे प्रदर्शित किया जाएगा। अगर LABEL को पारित किया जाता है, जैसे कि describe('एक विवरण।', LABEL), तो विवरण कैनवास के बगल में एक div तत्व में दिखाई देगा। LABEL का उपयोग करने से स्क्रीन रीडर के लिए अप्रयोगी प्रतिलिपियाँ बनती हैं। LABEL का उपयोग केवल विकास के दौरान करें। यदि FALLBACK को पारित किया जाता है, जैसे कि describe('एक विवरण।', FALLBACK), तो विवरण केवल स्क्रीन रीडर के लिए ही दिखाई देगा। यह डिफ़ॉल्ट मोड है। स्केच योग्यता वाले कैनवास विवरण लिखना को अधिक जानने के लिए पढ़ें। .