जब एक साथ कई गुणात्मक या मात्रात्मक मापदंडों के माध्यम से जटिल प्रदर्शन प्रोफाइल का मूल्यांकन करना हो, तो रडार चार्ट (या स्पाइडर वेब चार्ट) एक आदर्श दृश्यीकरण उपकरण है। केंद्रीय बिंदु से निकलने वाली त्रिज्यामान अक्षों के साथ बहुआयामी विशेषता पैमाने रखकर, रडार चार्ट्स अलग-अलग बहुभुज आकृतियों के रूप में बहुआयामी तुलनाएं दिखाते हैं। इससे इनका अनुकूल रूप से कौशल मूल्यांकन, विक्रेता मूल्यांकन स्कोरकार्ड, उत्पाद विशेषता बेंचमार्क, या खिलाड़ी प्रदर्शन प्रोफाइल के लिए उपयोग करना संभव होता है।
रडार चार्ट की यांत्रिकी
एपाची ईचार्ट्स में, रडार चार्ट्स एक निर्दिष्ट रडार कॉन्फ़िगरेशन ब्लॉक पर निर्भर करते हैं जो त्रिज्यामान अक्षों को परिभाषित करता है, जिन्हें संकेतक कुंजियों के रूप में जाना जाता है। श्रृंखला ऑब्जेक्ट सेट करता है प्रकार: 'रडार' और प्रत्येक घोषित संकेतक पैमाने के संबंधित संख्यात्मक ऐरे मानों को मैप करता है।
1. आवश्यक सेटअप
एक मूल रडार चार्ट बनाने के लिए, अपने आयामी सीमा मानों को अंदर परिभाषित करें रडार.संकेतक और अपनी श्रृंखला डेटा के भीतर संख्यात्मक ऐरे पास करें:
विकल्प = {
टूलटिप: {
ट्रिगर: 'आइटम'
},
लेजेंड: {
डेटा: ['आवंटित बजट', 'वास्तविक खर्च']
},
रडार: {
संकेतक: [
{ नाम: 'बिक्री', अधिकतम: 6500 },
{ नाम: 'प्रशासन', अधिकतम: 16000 },
{ नाम: 'सूचना प्रौद्योगिकी', अधिकतम: 30000 },
{ नाम: 'ग्राहक समर्थन', अधिकतम: 38000 },
{ नाम: 'विकास', अधिकतम: 52000 },
{ नाम: 'विपणन', अधिकतम: 25000 }
]
},
श्रृंखला: [
{
नाम: 'बजट बनाम खर्च',
प्रकार: 'रडार',
डेटा: [
{
मान: [4200, 3000, 20000, 35000, 50000, 18000],
नाम: 'आवंटित बजट'
},
{
मान: [5000, 14000, 28000, 26000, 42000, 21000],
नाम: 'वास्तविक खर्च'
}
]
}
]
};
उन्नत संरचनात्मक तकनीकें
रडार चार्ट्स को भरे हुए क्षेत्र बहुभुज, वृत्ताकार ग्रिड आकृतियों या अलग-अलग रंग विषयों के उपयोग से स्टाइल किया जा सकता है ताकि प्रोफाइल ओवरलैपिंग को पढ़ना आसान हो।
1. कस्टम ग्रिड आकृतियों के साथ बहुभुज क्षेत्र भरना
पृष्ठभूमि वेब ग्रिड को बहुभुज से वृत्त में बदलना और पारदर्शी क्षेत्र भरना प्रत्येक मापदंड प्रोफाइल के समग्र प्रभाव को उजागर करता है:
विकल्प = {
टूलटिप: {
ट्रिगर: 'आइटम'
},
लेजेंड: {
ऊपरी: '5%',
डेटा: ['मॉडल ए', 'मॉडल बी']
},
रडार: {
आकृति: 'वृत्त', // वृत्ताकार पृष्ठभूमि वेब
संकेतक: [
{ नाम: 'बैटरी जीवन', अधिकतम: 100 },
{ नाम: 'प्रोसेसिंग शक्ति', अधिकतम: 100 },
{ नाम: 'निर्माण गुणवत्ता', अधिकतम: 100 },
{ नाम: 'प्रदर्शन गुणवत्ता', अधिकतम: 100 },
{ नाम: 'कैमरा', अधिकतम: 100 },
{ नाम: 'मूल्य', अधिकतम: 100 }
]
},
श्रृंखला: [
{
प्रकार: 'रडार',
डेटा: [
{
मान: [80, 90, 70, 85, 95, 60],
नाम: 'मॉडल ए',
क्षेत्र शैली: {
रंग: 'rgba(84, 112, 198, 0.4)'
}
},
{
मान: [95, 70, 85, 90, 75, 90],
नाम: 'मॉडल बी',
क्षेत्र शैली: {
रंग: 'rgba(145, 204, 117, 0.4)'
}
}
]
}
]
};
लेआउट और स्टाइलिंग को समायोजित करना
संकेतक पाठ रंगों, विभाजन रेखाओं और प्रतीक आकारों को समायोजित करने से बहु-अक्षीय वेब रेखाओं के डेटा को अतिक्रमण करने से रोका जाता है।
1. कस्टम वेब ग्रिड और लेबल प्रारूपन
डार्क या लाइट इंटरफेस पर साफ दृश्य विपरीतता बनाए रखने के लिए अक्ष रेखाओं, विभाजित क्षेत्रों और बाहरी लेबलों को स्टाइल करें:
विकल्प = {
रेडार: {
संकेतक: [
{ नाम: 'उपयोगिता', अधिकतम: 10 },
{ नाम: 'प्रदर्शन', अधिकतम: 10 },
{ नाम: 'सुरक्षा', अधिकतम: 10 },
{ नाम: 'स्केलेबिलिटी', अधिकतम: 10 },
{ नाम: 'लागत कुशलता', अधिकतम: 10 }
],
अक्षनाम: {
रंग: '#333',
फ़ॉन्टआकार: 13,
मोटाई: 'बोल्ड'
},
विभाजनक्षेत्र: {
क्षेत्रशैली: {
रंग: ['rgba(250,250,250,0.3)', 'rgba(200,200,200,0.1)']
}
},
विभाजनरेखा: {
रेखाशैली: {
रंग: '#ccc'
}
}
},
श्रृंखला: [
{
प्रकार: 'रेडार',
प्रतीकआकार: 8,
रेखाशैली: {
चौड़ाई: 3
},
डेटा: [
{
मान: [8.5, 9.0, 7.5, 8.0, 9.5],
नाम: 'प्लेटफॉर्म स्कोर',
आइटमशैली: {
रंग: '#5470c6'
},
क्षेत्रशैली: {
रंग: 'rgba(84, 112, 198, 0.3)'
}
}
]
}
]
};
रणनीतिक बेस्ट प्रैक्टिसेज
- अक्ष पैमाने को मानकीकृत करें: सुनिश्चित करें कि संकेतकों में संभव होने पर सामान्यीकृत पैमाना रेंज (उदाहरण के लिए, 0 से 100 या 1 से 10) का उपयोग करें ताकि बाहरी बहुभुज क्षेत्र संतुलित तुलना को दर्शाएं।
- श्रृंखला ओवरलेज को कम रखें: रेडार तुलना आकृतियों की संख्या को प्रति चार्ट में 2 या 3 तक सीमित रखें। 4 या अधिक भरे हुए बहुभुजों के ओवरलैप करने से व्यक्तिगत आकृति सीमाओं को अलग करना मुश्किल हो जाता है।
- कम अपारदर्शिता क्षेत्र भरें: हमेशा पारदर्शी भराव (लगभग 0.2–0.4 अपारदर्शिता) लगाएं ताकि नीचे की ग्रिडलाइनें और प्रतिच्छेद करने वाले प्रोफाइल ऊपरी परतों के नीचे दिखाई दें।