उच्चकों का उपयोग करते हुए आँकड़ों का दृश्य

इस लेख में, मैं OS और डिस्क सरणी आंकड़ों के आधार पर Highcharts का उपयोग करके दृश्य और प्रस्तुत करने योग्य ग्राफ़ के निर्माण में अपने स्वयं के अनुभव का वर्णन करना चाहूंगा। कई आधुनिक ऑपरेटिंग सिस्टम और डिस्क सरणियों के लिए, अंतर्निहित या अतिरिक्त सॉफ़्टवेयर पर आधारित तंत्र हैं जो आपको ओएस या सरणी के सबसिस्टम के संचालन पर डेटा प्राप्त करने की अनुमति देते हैं (निशान नहीं, लेकिन किसी दिए गए अंतराल पर सांख्यिकीय संकेतक औसतन)। आप लैन और एफसी स्विच के इंटरफेस पर पैकेट और त्रुटि काउंटर पर आंकड़े भी एकत्र कर सकते हैं। बहुत से लोग इस डेटा की कल्पना करना चाहते हैं और इसका उपयोग रिपोर्ट या समोप्सी मॉनिटरिंग सिस्टम में करते हैं।



डिस्क्लेमर: मैं प्रोग्रामर के रूप में काम नहीं कर रहा हूं और इसमें कोड लिखने की बहुत सीमित क्षमता है, इसलिए इसकी गुणवत्ता पर जोर न डालें। इस मामले में, मुझे खुशी होगी यदि आप ध्यान दें कि आप छोटे / अधिक सक्षम / कोषेर को अनुकूलित और पुनः लिख सकते हैं।

अलग-अलग समय पर, मुझे एचपी-यूएक्स और लिनक्स सर्वर पर स्थापित एचपी स्टोरवर्क्स एक्सपी, एचपी ईवा, ईएमसी क्लैरियोन, ईएमसी सिमिट्रिक्स एरेज़ और ब्रोकेड एफसी स्विच इंटरफेस के लोड ग्राफ के आंकड़ों के आंकड़ों को संसाधित करना होगा। संभावित रूप से, Highcharts का उपयोग करना और न केवल आप CSV प्रारूप में प्रस्तुत किए गए किसी भी आंकड़े के आधार पर ग्राफ खींच सकते हैं और समय के अनुसार क्रमबद्ध कर सकते हैं। आप वास्तविक समय में ग्राफ भी खींच सकते हैं, जबकि एसएनएमपी का उपयोग करके डेटा एकत्र किया जाएगा। कई, निश्चित रूप से, कहेंगे कि प्रसिद्ध कैक्टि एसएनएमपी का उपयोग करके एकत्र किए गए रियलटाइम और संचित आंकड़ों के लिए एकदम सही है, और वे सही होंगे: इंटरनेट कैक्टि को तैनात करने और विभिन्न उपकरणों के लिए निगरानी सेटिंग्स के लिए गाइड से भरा है, कई कुत्तों को खाया गया था, और संभावनाएं तेज हैं और इस तरह की निगरानी तैनात किए बिना जाम बहुत अधिक है। मैं एक्सेल-आधारित रेखांकन से rrdtool और gnuplot जनरेट की गई छवियों और आखिरकार Highcharts में चला गया। यह बहुत संभव है कि वर्णित सभी समाधान संतुष्ट न हों, और कोई व्यक्ति जो मेरे द्वारा बताई गई विधि में रुचि रखता है।
* मापवेयर (ओपनव्यू परफॉर्मेंस एजेंट) आपको इस समय ओएस संसाधनों (एचपी-यूएक्स, लिनक्स, विंडोज) के उपयोग की निगरानी करने और संचित डेटा को देखने की अनुमति देता है, इसे आगे की प्रक्रिया के लिए एएससीआईआई प्रारूप पर अपलोड करें। इसका उपयोग करते हुए, आप विभिन्न ओएस सबसिस्टम, व्यक्तिगत प्रक्रियाओं, अनुकूलित अनुप्रयोग समूहों (उदाहरण के लिए, सिस्टम में सभी ora_dbw * प्रक्रियाओं) के संचालन के लिए महत्वपूर्ण मैट्रिक्स के मूल्यों को प्राप्त कर सकते हैं। सिस्टम प्रदर्शन में संभावित अड़चनों की पहचान करने के लिए ओएस और इसकी प्रक्रियाओं को ट्रेस करने के साथ-साथ मापक डेटा का उपयोग किया जाता है। जानकारी विज्ञापित नहीं की गई है, मैं अब एचपी पर काम नहीं करता, मैं सिर्फ एक सुविधाजनक उपकरण का उल्लेख करना चाहता था जो एक अलग लेख के योग्य है (क्या, हबराज़िटेल यूनिक्स के मालिकाना औद्योगिक संस्करणों पर उपयोग किए जाने वाले सॉफ़्टवेयर विषयों में रुचि रखते हैं?)।

हाईचर क्या है और यह क्या खाता है?

यह जावास्क्रिप्ट का उपयोग करके एक चार्टिंग लाइब्रेरी है। इंटरैक्टिव ग्राफ़ को प्रस्तुत करने और प्रदर्शित करने के लिए मुख्य रूप से एक ब्राउज़र का उपयोग करता है। क्यों है Highcharts अच्छा? IE में भी सब कुछ आपके पसंदीदा FF और क्रोम और सफारी (i-Tech पर) में प्रदान किया गया है; आप चार्ट के साथ बातचीत कर सकते हैं: पैमाने को बदल सकते हैं, अनावश्यक चार्ट को बंद कर सकते हैं या आवश्यक चार्ट को हाइलाइट कर सकते हैं, नए बिंदु जोड़ सकते हैं, माउस क्लिक प्रोसेसर, टूलटिप्स आदि का उपयोग कर सकते हैं; इनपुट डेटा को स्थानीय फ़ाइल से पढ़ा जा सकता है, AJAX का उपयोग कर सकते हैं, डेटाबेस का उपयोग कर सकते हैं, json फॉर्मेट में प्राप्त कर सकते हैं (क्षमा करें यदि मैं सही तरीके से तैयार नहीं करता या गलत शर्तों का उपयोग करता हूं)। इसके अलावा, माउस हेरफेर द्वारा, प्राप्त ग्राफिक्स को पीएनजी छवियों में बचाया जा सकता है। कुछ बिंदु पर, मुझे बहुत सी अलग-अलग तस्वीरें बनाने की ज़रूरत थी और मैं बहुत आलसी था और बहुत कुछ क्लिक करने के लिए, मैं एक बैच बनाना चाहता था। हाईचर्ट्स सपोर्ट फोरम पर वर्णित नोड, राइनो, और अन्य जुड़नार के लिए मेरे न्युबियन प्रयासों ने (वैसे, काफी जल्दी और अनुकूल और मदद का जवाब दिया), कुछ भी नहीं किया। उसके लिए, मैंने उपयोगिता iecapt.exe की खोज की (जैसा कि मैं इसे समझता हूं, कटाइकैप का एनालॉग, जिसके बारे में हैबे पर कुछ लेख हैं) - जेएस कोड और रेंडरिंग को संसाधित करने के लिए उपयुक्त ठहराव सेट करते समय, ब्राउज़र से निर्यात करते समय समान चित्र प्राप्त किए जाते हैं।

मुझे कहना होगा कि PNG / JPEG / PDF को निर्यात करना SVG को सर्वर-साइड मॉड्यूल और लाइब्रेरीज़ का उपयोग करके PNG में परिवर्तित करने पर आधारित है और इसके लिए सर्वर पर php पेज की आवश्यकता होती है, या highcharts.com पर रीडायरेक्ट होती है। हाईचार्ट के हाल के संस्करणों में, उन्होंने गतिशील रूप से निर्मित चार्ट और ग्राफ़ में ज़ूम के निर्यात को निर्धारित किया। ग्राफिक्स के निर्यात के बिना, आप उन्हें एक साधारण HTML फ़ाइल को जेएस बॉडी किट और jquery.js के साथ स्थानीय रूप से सहेज कर स्थानीय रूप से देख सकते हैं। आप निर्यात के लिए उल्लिखित उपयोगिता iecapt / cutycapt का भी उपयोग कर सकते हैं। वास्तविक समय में FC स्विच पर ट्रैफ़िक आँकड़े प्राप्त करने के लिए, मैंने php पृष्ठ का उपयोग किया, जिसने php_snmp मॉड्यूल का उपयोग करके स्विच पर MIB ट्री में आवश्यक OID को नियमित रूप से प्रदूषित किया और डेटा पार्स किया। ध्यान रखें कि कोई भी एसएनएमपी अनुरोध स्विच प्रोसेसर चक्रों का उपभोग करता है और अत्यधिक अनुरोधों के साथ अतिभारित नहीं होना चाहिए। ब्रोकेड के पास इस विषय पर एक सेवा नोट भी है: उच्च प्रोसेसर उपयोग से एफसी बंदरगाहों के रीसेट हो सकते हैं, संभावना छोटी है, लेकिन यह मौजूद है और उपयोग किए गए ट्रांसीवर (निर्माता और फर्मवेयर संशोधन) के प्रकार पर निर्भर करता है। ऑफटॉपिक के लिए क्षमा करें, लेकिन "चेतावनी दी - सशस्त्र का मतलब है।"

बाहर निकलने पर हाईचर्ट के साथ मुझे क्या मिल सकता है?

विज़ुअलाइज़ेशन के लिए, आप निम्न प्रकार के ग्राफ़ का उपयोग कर सकते हैं:

पाई - उदाहरण के लिए, दृश्यपटल पर लोड में सर्वर समूहों के वितरण को दिखाने के लिए:


स्तंभ - हिस्टोग्राम बनाने के लिए:


तर्जनी - विषम मेट्रिक्स के लिए, और आप अपने स्वयं के पैमाने और पैमाने के साथ कई कुल्हाड़ियों का उपयोग कर सकते हैं और उन्हें विभिन्न ग्राफ संलग्न कर सकते हैं:


ओवरले मीट्रिक के प्रभाव को प्रदर्शित करने के लिए क्षेत्र या क्षेत्र रेखा:


या इसके विपरीत - स्विच इंटरफेस पर बहुआयामी ट्रैफ़िक प्रवाह के विपरीत:


Highcharts प्रोजेक्ट पेज पर आपको कई अन्य उपयोगी और दिलचस्प प्रकार के चार्ट मिलेंगे। परियोजना विकसित हो रही है, अपडेट सामने आ रहे हैं, मंच पर आप कई उपयोगी व्यंजनों को पा सकते हैं।

एक फ़ाइल से संचित डेटा को संसाधित करना और वास्तविक समय में पहुंचना

तो हमारे पास प्रवेश द्वार पर क्या है? मैं जानबूझकर डेटा एकत्र करने और उन्हें CSV प्रारूप में अपलोड करने के चरण को छोड़ देता हूं, जैसा कि यह प्रत्येक ऑपरेटिंग सिस्टम या उपयोग किए गए डिस्क सरणियों के लिए एक अलग लेख का विषय है। इसलिए, हमें इस तरह के उदाहरण के लिए अलग-अलग मेट्रिक्स (क्षैतिज रूप से) के मानों की तालिका की आवश्यकता होगी जो समय के साथ (लंबवत) बदलती हैं, इसी शीर्षक के साथ:
Unixtime, metric1, metric2, metric3
1297666800, val1_1, val2_1, val3_1
1297666860, val1_2, val2_2, val3_2
और इसी तरह

डेटा को एक तालिका के रूप में भी प्रस्तुत किया जा सकता है, जहां प्रत्येक पंक्ति समान रूप से समय अंतराल पर मापा गया एक विशिष्ट मीट्रिक के मूल्यों को सूचीबद्ध करती है, उदाहरण के लिए इस तरह (शीर्षक में ग्राफ के लिए शीर्षक, संदर्भ बिंदु और अंतराल शामिल है):
Lan0 आँकड़े, 1297666800, 600
आरएक्स बीपीएस, 2000, 3000, 4000
टीएक्स बीपीएस, 1200, 1600, 2000

प्रदर्शित मेट्रिक्स को अंतःक्रियात्मक रूप से चुनने के लिए मेरा पेज कुछ इस तरह दिखता है और डेटा के स्थान के लिए पहले विकल्प के साथ फ़ाइलों का उपयोग करता है (यानी, क्षैतिज रूप से, प्रत्येक पंक्ति में एक निश्चित समय अंतराल पर उनके मान):


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

इस पृष्ठ पर काम करने के लिए आवश्यक फाइलें इस प्रकार हैं:

1. mwa.htm - एक फ़ाइल, उसके मैट्रिक्स और ड्राइंग ग्राफ़ का चयन करने वाला मुख्य पृष्ठ;
2. jquery.js - इस प्रसिद्ध पुस्तकालय को इसके बगल में रख दें, या इसका उपयोग किसी बाहरी वेब सर्वर पर स्थित करें (जो कोई भी ढूंढ लेगा वह मिल जाएगा);
3. ताज़ा js और निर्यात-सर्वर फ़ोल्डर Highcharts प्रोजेक्ट साइट से डाउनलोड किए जाते हैं। Tyts पृष्ठ बताता है कि स्थानीय निर्यात को कैसे कॉन्फ़िगर किया जाए;
4. getlist.php - mwa.htm से टेम्प्लेट द्वारा आँकड़ों के साथ इनपुट CSV फ़ाइलों की खोज के लिए एक अतुल्यकालिक अनुरोध करने के लिए आवश्यक;
5. mwa_S-DB-1__weekG.csv एक सप्ताह के लिए HP-UX होस्ट पर आँकड़ों के उदाहरण के साथ;
6. live_snmp_only.php - ब्रोकेड स्विच के FC पोर्ट के लोड शेड्यूल को प्लॉट करने के लिए एक अतिरिक्त पेज, जिसे "live_snmp_only.php? host = 10.20.30.40" और fcPort = 20 "अनुरोध का उपयोग करके कहा जाता है। समुदाय निम्न फ़ाइल में लिखा गया है;
7. snmp64.php - इसे live_snmp_only.php से नियमित रूप से कॉल किया जाता है और ब्रोकेड स्विच के एफसी पोर्ट की आउटगोइंग और इनकमिंग स्पीड प्राप्त करता है (सिस्को एफसी या लैन के साथ, अभी तक कोई अनुभव नहीं था, बस उचित ओआईडी का उपयोग करें)। FOS के पुराने संस्करणों पर, 64-बिट काउंटर नहीं हो सकते हैं।

फ़ाइलों के साथ संग्रह http://ge.tt/96cqBa7 और http://depositfiles.com/files/06h2ky72e + http://depositfiles.com/files/o6ycfl3kw (एक बड़ा संग्रह एक JS किट है और लाइब्रेरीज़ के लिए आवश्यक है) पर अपलोड किया गया है पीएनजी को निर्यात)

एक वास्तविक समय के निर्माण के मामले में, स्विच से ताज़ा ट्रैफ़िक डेटा प्राप्त करने से पहले, आप डेटाबेस में एक अनुरोध कर सकते हैं जिसमें स्विच से आंकड़े नियमित रूप से डाउनलोड किए जाते हैं (उदाहरण के लिए, एसएनएमपी के माध्यम से), और चार्ट पर इन बिंदुओं का निर्माण करें। नए डेटा के बाद के अनुरोध "ताज़ा" बिंदु जोड़ देंगे और ग्राफ़ को स्थानांतरित कर देंगे।

वैसे, मैं रियल टाइम चार्ट के लिए वांछित टाइमज़ोन में समय के हस्तांतरण को दूर करने में सक्षम नहीं था। जो कोई समाधान पाता है, उसके लिए अग्रिम धन्यवाद।

एक निश्चित मीट्रिक के मानों के साथ स्ट्रिंग्स के रूप में CSV फ़ाइल में डेटा व्यवस्था के एक संस्करण के लिए, इस तरह के एक शिट कोड "var चार्ट = new Highcharts.Chart (विकल्प);"
// Verticaly dispersed data:
var items = lines[metricNo].split(',');
series.name = items[0];
$.each(items, function(itemNo, item) {
if (itemNo>0 && parseInt(item)>=0) {
series.data.push(parseInt(item)); // its important to parseInt !!!!
}
});
series.pointStart = parseInt(start); // its important to parseInt !!!!
series.pointInterval = parseInt(interval);
options.series.push(series);*/

बशर्ते कि मूल्यों को नियमित अंतराल (Series.pointInterval) पर एकत्र किया जाए और "अंतराल" न हो।

अंत में, मंच से कुछ सुझाव और व्यंजनों:

• चार्ट पर 500 से अधिक बिंदुओं का उपयोग न करने का प्रयास करें, अन्यथा सभ्य ब्रेक शुरू हो जाएंगे।
• यह मत भूलो कि उस समय को एक समय प्रारूप में 1000 से गुणा किया जाना चाहिए ताकि यह चार्ट पर सही ढंग से प्रदर्शित हो।
• आप यहाँ कुछ रेखांकन पर बिंदुओं के चयन के बारे में पढ़ सकते हैं: http://highslide.com/forum/viewtopic.php?f=9&t=8101
• एक htm पृष्ठ पर कई ग्राफ़ बनाने और ईवेंट द्वारा नए बिंदुओं को जोड़ने के लिए: http://highslide.com/forum/viewtopic.php?f=9&t=8030 और http://jsfiddle.net/QCefk/1/
• होवर द्वारा ग्राफ का रंग बदलना: http://jsfiddle.net/vu8DB/
• "गलियारे" के अंदर एक ग्राफ प्लॉट करना, संकेत करना, उदाहरण के लिए, एक माप त्रुटि या मूल्यों का प्रसार: http://jsfiddle.net/pHFfF/3/
• माउस स्केलिंग: http://jsfiddle.net/HXUmK/4/
• डबल एक्स एक्सिस: http://jsfiddle.net/PPAUx/26/
• मिनिमा और मैक्सिमा ढूँढना: http://jsfiddle.net/ebuTs/7/

मुझे वास्तव में हाईचर्स पुस्तकालय और ग्राफिक्स पसंद हैं जो आप इसके साथ बना सकते हैं। मुझे उम्मीद है कि आपको भी यह पसंद आया होगा।

UPD: मुझे बताएं कि स्क्रिप्ट्स के साथ अभिलेखागार को स्थानांतरित करना कहां तक ​​अधिक विश्वसनीय है, अन्यथा आप शायद ge.tt और डिपॉजिट पर खराब हो जाएंगे?