किबाना में आधिकारिक डेटा विज़ुअलाइज़ेशन प्रलेखन के अनुवाद का पांचवा हिस्सा।
मूल सामग्री से लिंक:
किबाना उपयोगकर्ता गाइड [6.6] »कल्पना करेंभाग 1 से लिंक:
Kibana उपयोगकर्ता गाइड। दृश्य। भाग 1भाग 2 का लिंक:
किबाना यूजर गाइड। दृश्य। भाग २भाग 3 का लिंक:
किबाना यूजर गाइड। दृश्य। भाग 3भाग 4 का लिंक:
किबाना यूजर गाइड। दृश्य। भाग ४भाग 5 का लिंक:
किबाना यूजर गाइड। दृश्य। भाग 5सामग्री:
1. वेगा रेखांकन
2. विज़ुअलाइज़ेशन का निरीक्षण करना
वेगा की गणना करता है
चेतावनी। यह सुविधा प्रायोगिक है और भविष्य में रिलीज़ में इसे बदला या हटाया जा सकता है। इलास्टिक किसी भी समस्या को ठीक करने की पूरी कोशिश करेगा, लेकिन प्रायोगिक कार्यों को एसएलए आधिकारिक जीए कार्यों द्वारा समर्थित नहीं किया जाता है।
आप
किवाना के अंदर
वेगा और
वेगा डेटा के विज़ुअलाइज़ेशन का निर्माण कर सकते हैं, दोनों ऑफ़लाइन और मानचित्र के शीर्ष पर। वेगा को कार्रवाई में देखने के लिए, यह
संक्षिप्त अवलोकन वीडियो देखें ।
वेगा के साथ शुरू करें
अपना पहला वेगा दृश्य बनाने के लिए इन चरणों का पालन करें।
- किबाना में, विज़ुअलाइज़ेशन चुनें और वेगा विज़ुअलाइज़ेशन जोड़ें। आपको डिफ़ॉल्ट ग्राफ़ देखना चाहिए।
line से point , area , bar , circle , square , ... ( दस्तावेज़ देखें) पर mark बदलने का प्रयास करें।- बाकी वेगा या वेगालाइट विज़ुअलाइज़ेशन आज़माएँ। उदाहरण के लिए, आपको URL को पूर्ण बनाने की आवश्यकता हो सकती है, उदाहरण के लिए
"url": "data/world-110m.json" को "url": "https://vega.imtqy.com/editor/data/world-110m.json" "url": "data/world-110m.json" "url": "https://vega.imtqy.com/editor/data/world-110m.json" (नीचे नोट देखें)। - Makelogs उपयोगिता का उपयोग करते हुए , कुछ लॉगस्टैश डेटा बनाएं और लॉगस्टैश उदाहरणों का प्रयास करें ( उत्पादन क्लस्टर पर makelogs का उपयोग न करें)।
वेगा बनाम वेगालाइट
VegaLite Vega का एक सरलीकृत संस्करण है, जो एक त्वरित शुरुआत के लिए उपयोगी है, लेकिन कई सीमाओं के साथ। निष्पादन से पहले वेगालाइट स्वचालित रूप से वेगा में परिवर्तित हो जाती है।
Logstash-simple_line-vega और
logstash-simple_line-vegalite (दोनों ही Elasticsearch से कुछ logstash डेटा का उपयोग करें) की तुलना करें। आप
इस संपादक का उपयोग वेगा को वीटगेट में बदलने के लिए कर सकते हैं।
एलिटिक्स खोज क्वेरी
डिफ़ॉल्ट रूप से, एक वेगा
डेटा आइटम
"url" पैरामीटर के साथ आंतरिक और बाहरी डेटा का उपयोग कर सकता है। Kibana
"url" मान को पुनः लोड करके प्रत्यक्ष Elasticsearch प्रश्नों के लिए समर्थन जोड़ता है।
यहां एक एलीस्टैचर्च क्वेरी का एक उदाहरण है जो सभी अनुक्रमित दस्तावेज़ों की संख्या को गिनाता है। क्वेरी समय सीमा को फ़िल्टर करने और हिस्टोग्राम खंडों में विभाजित करने के लिए
@timestamp फ़ील्ड का उपयोग करती है।
// An object instead of a string for the url value // is treated as a context-aware Elasticsearch query. url: { // Filter the time picker (upper right corner) with this field %timefield%: @timestamp // Apply dashboard context filters when set %context%: true // Which indexes to search index: _all // The body element may contain "aggs" and "query" subfields body: { aggs: { time_buckets: { date_histogram: { // Use date histogram aggregation on @timestamp field field: @timestamp // interval value will depend on the daterange picker // Use an integer to set approximate bucket count interval: { %autointerval%: true } // Make sure we get an entire range, even if it has no data extended_bounds: { min: { %timefilter%: "min" } max: { %timefilter%: "max" } } // Use this for linear (eg line, area) graphs // Without it, empty buckets will not show up min_doc_count: 0 } } } // Speed up the response by only including aggregation results size: 0 } }
पूर्ण परिणाम में निम्न संरचना प्रकार है:
{ "aggregations": { "time_buckets": { "buckets": [{ "key_as_string": "2015-11-30T22:00:00.000Z", "key": 1448920800000, "doc_count": 28 }, { "key_as_string": "2015-11-30T23:00:00.000Z", "key": 1448924400000, "doc_count": 330 }, ...
ध्यान दें कि
"key" एक यूनिक्स टाइमस्टैम्प है और इसे वेगा तिथि के भावों द्वारा रूपांतरण के बिना उपयोग किया जा सकता है।
अधिकांश रेखांकन के लिए, हमें केवल खंड मानों की एक सूची की आवश्यकता होती है, इसलिए हम अभिव्यक्ति
format: {property: "aggregations.time_buckets.buckets"} उपयोग करते हैं
format: {property: "aggregations.time_buckets.buckets"} केवल उस डेटा पर ध्यान केंद्रित करने के लिए जिसकी हमें आवश्यकता है।
अनुरोध को एक व्यक्तिगत सीमा और संदर्भ जानकारी पैनल के साथ निर्दिष्ट किया जा सकता है। यह क्वेरी
"%context%": true, "%timefield%": "@timestamp" बराबर है
"%context%": true, "%timefield%": "@timestamp" , समय सीमा को 10 मिनट पहले स्थानांतरित करने के अलावा।
{ body: { query: { bool: { must: [ // This string will be replaced // with the auto-generated "MUST" clause "%dashboard_context-must_clause%" { range: { // apply timefilter (upper right corner) // to the @timestamp variable @timestamp: { // "%timefilter%" will be replaced with // the current values of the time filter // (from the upper right corner) "%timefilter%": true // Only work with %timefilter% // Shift current timefilter by 10 units back shift: 10 // week, day (default), hour, minute, second unit: minute } } } ] must_not: [ // This string will be replaced with // the auto-generated "MUST-NOT" clause "%dashboard_context-must_not_clause%" ] } } } }
"%timefilter%" उपयोग एकल न्यूनतम या अधिकतम मूल्य निर्धारित करने के लिए भी किया जा सकता है। जैसा कि ऊपर दिखाया गया है, date_histogram में Extended_bounds दो मूल्यों के साथ सेट किए जा सकते हैं - न्यूनतम और अधिकतम। मान को हार्ड कोड करने के बजाय, आप
"min": {"%timefilter%": "min"} उपयोग कर सकते हैं, जो वर्तमान समय सीमा की शुरुआत में ओवरराइट किया जाएगा।
shift और
unit वैल्यू भी समर्थित हैं। "अंतराल" को गतिशील रूप से सेट किया जा सकता है, वर्तमान में चयनित सीमा पर निर्भर करता है:
"interval": {"%autointerval%": 10} लगभग 10-15 डेटा पॉइंट (सेगमेंट) प्राप्त करने की कोशिश करेगा।
लोचदार मानचित्र फ़ाइलें
यह कुछ तंत्र के अनुसार लोचदार मानचित्र सेवा फ़ाइलों तक पहुंचने की क्षमता है।
url: { // "type" defaults to "elasticsearch" otherwise type: emsfile // Name of the file, exactly as in the Region map visualization name: World Countries } // The result is a geojson file, get its features to use // this data source with the "shape" marks // https://vega.imtqy.com/vega/docs/marks/shape/ format: {property: "features"}
मानचित्र के साथ वेगा
डिफ़ॉल्ट रूप से किबाना मानचित्र का उपयोग वेगा ग्राफ के लिए आधार के रूप में किया जा सकता है। सक्षम करने के लिए, ग्राफ़ को होस्ट कॉन्फ़िगरेशन में
type=map को परिभाषित करना होगा।
{ "config": { "kibana": { "type": "map", // Initial map position "latitude": 40.7, // default 0 "longitude": -74, // default 0 "zoom": 7, // default 2 // defaults to "default". Use false to disable base layer. "mapStyle": false, // default 0 "minZoom": 5, // defaults to the maximum for the given style, // or 25 when base is disabled "maxZoom": 13, // defaults to true, shows +/- buttons to zoom in/out "zoomControl": false, // defaults to true, disables mouse wheel zoom "scrollWheelZoom": false, // When false, repaints on each move frame. // Makes the graph slower when moving the map "delayRepaint": true, // default true } }, /* the rest of Vega JSON */ }
यह विज़ुअलाइज़ेशन स्वचालित रूप से
"projection" नामक एक प्रोजेक्शन को एम्बेड करेगा। सभी भू-उन्मुख टैग की स्थिति की गणना करने के लिए इसका उपयोग करें। इसके अतिरिक्त, आप देशांतर, अक्षांश और पैमाने का उपयोग कर सकते हैं। इन संकेतों का उपयोग ग्राफ में किया जा सकता है या मानचित्र की स्थिति को बदलने के लिए अद्यतन किया जा सकता है।
डिबगिंग
ब्राउज़र डीबग कंसोल
डिबगिंग के लिए ब्राउज़र टूल का उपयोग करें (उदाहरण के लिए, Chrome में F12 या Ctrl + Shift + J),
VEGA_DEBUG चर का निरीक्षण करने के लिए: *
view - वेगा वस्तु को
view लिए उपयोग। रनवे पर डेटा और संकेतों का निरीक्षण करने के लिए
वेगा डिबगिंग गाइड देखें। वेगालाइट के लिए,
VEGA_DEBUG.view.data('source_0') को मुख्य डेटा सेट मिलता है। वेगा के लिए, यह एक डेटा नाम का उपयोग करता है, जो विशेष रूप से आपके वेगा विनिर्देश में है। *
vega_spec कुछ संशोधनों के बाद वेगा JSON ग्राफ का
vega_spec विनिर्देशन। VegaLite के मामले में, यह VegaLite कंपाइलर का आउटपुट है। *
vegalite_spec - यदि यह एक वेगा ग्राफ है, तो VegaLite संकलन से पहले ग्राफ के JSON विनिर्देशन
डेटा
यदि आप एक एलेस्टिक्स खोज क्वेरी का उपयोग कर रहे हैं, तो सुनिश्चित करें कि प्राप्त डेटा वह है जो आपने अपेक्षित किया था। इसे देखने का सबसे आसान तरीका आपके ब्राउज़र डीबगिंग टूल (उदाहरण के लिए, F12) में "नेटवर्किंग" टैब का उपयोग करना है। ग्राफ़ को थोड़ा संशोधित करें ताकि वह खोज क्वेरी बना सके और सर्वर प्रतिक्रिया पर नज़र डाले। एक अन्य दृष्टिकोण
किबना देव टूल्स टैब का उपयोग करना है - पहली पंक्ति के अंदर सूचकांक नाम डालता है:
GET <INDEX_NAME>/_search , और अगली पंक्ति (केवल
"query" फ़ील्ड के मूल्य) के साथ अपनी क्वेरी जोड़ें।
यदि आपको किसी के साथ ग्राफ को साझा करने की आवश्यकता है, तो आप डेटा स्ट्रिंग की प्रतिक्रिया को
gist.github.com पर कॉपी कर सकते हैं, संभवत: .json एक्सटेंशन के साथ, [कच्चे] बटन का उपयोग करें, और सीधे अपने ग्राफ़ में इस यूआरएल का उपयोग करें।
नॉन-ईएस डेटा स्रोतों का उपयोग करने से वेगा को रोकने के लिए,
vega.enableExternalUrls: false kibana.yml फ़ाइल के लिए
vega.enableExternalUrls: false जोड़ें।
उपयोगी लिंक
वेगा और वेगालाइट उदाहरणों का उपयोग करना
वेगा और
वेगालाइट उदाहरणों का उपयोग करते समय, आपको निरपेक्ष URL का उपयोग करने के लिए "डेटा" अनुभाग को संशोधित करना होगा। उदाहरण के लिए,
"url": "data/world-110m.json" को
"url": "https://vega.imtqy.com/editor/data/world-110m.json" "url": "data/world-110m.json" "url": "https://vega.imtqy.com/editor/data/world-110m.json" । इसके अलावा, नियमित वेगा उदाहरणों में, वे ऑटोसाइज़ लेआउट मॉडल का उपयोग करते हैं
"autosize": "pad" , और किबाना
fit का उपयोग करते
fit । सभी
autosize ,
width और
height मान निकालें। आयाम और स्थिति नीचे देखें।
अतिरिक्त कॉन्फ़िगरेशन विकल्प
ये विकल्प किबाना के लिए विशिष्ट हैं। कार्ड समर्थन में अतिरिक्त कॉन्फ़िगरेशन विकल्प हैं।
{ config: { kibana: { // Placement of the Vega-defined signal bindings. // Can be `left`, `right`, `top`, or `bottom` (default). controlsLocation: top // Can be `vertical` or `horizontal` (default). controlsDirection: vertical // If true, hides most of Vega and VegaLite warnings hideWarnings: true // Vega renderer to use: `svg` or `canvas` (default) renderer: canvas } } /* the rest of Vega code */ }
आकार और स्थिति
वेगा और शाकाहारी।
डिफ़ॉल्ट रूप से, किबाना में वेगा ग्राफ ऑटोसेज़
autosize = { type: 'fit', contains: 'padding' } उपयोग करेंगे
autosize = { type: 'fit', contains: 'padding' } वेगा और वेगा ग्राफ के लिए
autosize = { type: 'fit', contains: 'padding' } लेआउट मॉडल।
fit मॉडल सभी उपलब्ध स्थान का उपयोग करता है,
width और
height मूल्यों की अनदेखी करता है, लेकिन इंडेंट वैल्यू को ध्यान में रखता है। आप एक अलग
autosize मान निर्दिष्ट करके इस व्यवहार को ओवरराइड कर सकते हैं।
मानचित्र पर वेगा।
सभी वेगा ग्राफ शून्य-इंडेंट
fit मॉडल का उपयोग करके
autosize ,
width ,
height और
padding को अनदेखा करेंगे।
दृश्य निरीक्षण
कई विज़ुअलाइज़ेशन आपको विज़ुअलाइज़ेशन अंतर्निहित डेटा का निरीक्षण करने की अनुमति देते हैं।
विज़ुअलाइज़ेशन का निरीक्षण करने के लिए, संपादक में
निरीक्षण बटन पर क्लिक करें या डैशबोर्ड पैनल मेनू से
निरीक्षण का चयन करें।
प्रारंभिक स्क्रीन विज़ुअलाइज़ेशन के लिए मूल डेटा दिखाती है। आप
स्वरूपित या
कच्चे स्वरूपों में डेटा को अल्पविराम से अलग किए गए मान (CSV) के रूप में लोड कर सकते हैं। तालिका प्रारूप में
प्रारूपित लोड डेटा। प्रस्तुत आंकड़ों के अनुसार
रॉ डेटा को लोड करता है - टाइमस्टैम्प के रूप में तारीखें, हजार विभाजकों के बिना संख्या आदि।
डेटा एकत्र करने वाले अनुरोधों को देखने के लिए, ऊपरी दाईं ओर
दृश्य मेनू से
अनुरोधों का चयन करें।
क्या दृश्य उपलब्ध हैं यह निरीक्षण किए गए दृश्य पर निर्भर करता है।