DonutChart नियंत्रण (पूर्वावलोकन)

[यह आलेख रिलीज़-पूर्व दस्तावेज़ है और परिवर्तन के अधीन है.]

डोनट चार्ट का उपयोग अनुपात दिखाने के लिए किया जाता है, जो कुल मूल्य की तुलना में आंशिक मूल्य को व्यक्त करता है। इस प्रकार के चार्ट समग्रता की तुलना में व्यक्तिगत भागों का प्रतिशत दिखाने के लिए सर्वोत्तम होते हैं, जहां समय के साथ परिवर्तन को दर्शाना महत्वपूर्ण नहीं होता। वे वृत्ताकार सांख्यिकीय ग्राफिक्स हैं जिन्हें संख्यात्मक अनुपात दर्शाने के लिए टुकड़ों में विभाजित किया गया है।

यह कोड घटक कैनवास और कस्टम पृष्ठों में उपयोग के लिए फ्लुएंट UI डोनटचार्ट नियंत्रण के चारों ओर एक आवरण प्रदान करता है।

महत्त्वपूर्ण

• यह एक पूर्वावलोकन सुविधा है.
• पूर्वावलोकन सुविधाएँ उत्पादन में उपयोग के लिए नहीं होती हैं और इनकी कार्यक्षमता प्रतिबंधित हो सकती हैं. यह सुविधाएँ आधिकारिक रिलीज़ से पहले उपलब्ध होती हैं ताकि ग्राहक शीघ्र पहुँच प्राप्त कर सकें और प्रतिक्रिया प्रदान कर सकें.

नोट

पूर्ण दस्तावेज़ीकरण और स्रोत कोड GitHub कोड घटक भंडार में पाया गया। ...

विशेषता

नियंत्रण निम्नलिखित गुण स्वीकार करता है:

• शीर्षक - यह मान चार्ट का शीर्षक दर्शाता है।

• HideLabel - यह विकल्प नियंत्रित करता है कि चार्ट पर लेबल दिखाए जाएं या छिपाए जाएं।

• HideTooltip - यह विकल्प नियंत्रित करता है कि चार्ट पर टूलटिप्स दिखाए जाएं या छिपाए जाएं।

• ShowLabelsInPercentage - यह विकल्प नियंत्रित करता है कि लेबल को प्रतिशत में दिखाया जाए या नहीं।

• InnerRadius - डोनट चार्ट की आंतरिक त्रिज्या के लिए मान सेट करें।

• ValueInsideDonut - यह गुण डोनट चार्ट के अंदर दिखाए जाने वाले मान को दर्शाता है।

• CustomColors - इस प्रॉपर्टी का उपयोग चार्ट पर कस्टम रंग दिखाने के लिए किया जाता है, यदि प्रदान किया गया हो

• आइटम - रेंडर करने के लिए एक्शन आइटम

  • ItemTitle - विशेष चार्ट डेटा(आइटम) का प्रदर्शन नाम.
  • ItemKey - आइटम की पहचान करने के लिए उपयोग की जाने वाली कुंजी. कुंजियाँ अद्वितीय होनी चाहिए.
  • ItemValue - विशेष चार्ट डेटा(आइटम) का मान सेट करें।
  • ItemColor - विशेष चार्ट डेटा (आइटम) के लिए प्रदर्शित किए जाने वाले रंग का नाम या HEX मान सेट करें।

नोट

आइटम का रंग केवल तभी लागू होता है जब CustomColors गुण चालू हो.

पहुँच क्षमता

• एक्सेसिबिलिटी लेबल - स्क्रीन रीडर aria-label

उपयोग

नियंत्रण के Items गुण में संगत चार्ट गुणों पर डेटा मानों को मैप करें, जैसा कि नीचे दिए गए सूत्र में दर्शाया गया है। चार्ट स्वचालित रूप से सापेक्ष मूल्यों से मेल खाने के लिए दृश्य को समायोजित करता है।

सुसंगत रंग परिभाषित करने के लिए CustomColors गुण को सक्षम करें.

Table(
    {
        ItemLegend: "First",
        ItemValue: 60,
        ItemColor:"#00A892"
    },
    {
        ItemLegend: "Second",
        ItemValue: 10,
        ItemColor:"#9A44FC"
    },
    {
        ItemLegend: "Third",
        ItemValue: 30,
        ItemColor:"#3483FA"
    }
)

सीमाएँ

इस कैनवास घटक का उपयोग केवल कैनवास ऐप और कस्टम पृष्ठों में ही किया जा सकता है.