🙎🏿 👨🏽‍🏫 👎🏾 Panduan Pengguna Kibana. Visualisasi. Bagian 6 📙 👋 🙋🏿

Seperlima dari terjemahan dokumentasi visualisasi data resmi di Kibana.

Tautan ke materi asli: Kibana User Guide [6.6] »Visualisasikan

Tautan ke Bagian 1: Panduan Pengguna Kibana. Visualisasi. Bagian 1
Tautan ke Bagian 2: Panduan Pengguna Kibana. Visualisasi. Bagian 2
Tautan ke Bagian 3: Panduan Pengguna Kibana. Visualisasi. Bagian 3
Tautan ke Bagian 4: Panduan Pengguna Kibana. Visualisasi. Bagian 4
Tautan ke Bagian 5: Panduan Pengguna Kibana. Visualisasi. Bagian 5

Konten:

1. Grafik Vega

2. Memeriksa Visualisasi

Hitungan Vega

Peringatan Fitur ini bersifat eksperimental dan dapat diubah atau dihapus dalam rilis mendatang. Elastis akan melakukan yang terbaik untuk memperbaiki masalah, tetapi fungsi eksperimental tidak didukung oleh fungsi GA resmi SLA.
Anda dapat membuat visualisasi data Vega dan VegaLite di dalam Kibana, baik offline maupun di atas peta. Untuk melihat Vega beraksi, tonton video ikhtisar singkat ini.

Mulai dengan Vega

Ikuti langkah-langkah ini untuk membuat visualisasi Vega pertama Anda.

Di Kibana, pilih Visualisasikan dan tambahkan visualisasi Vega. Anda akan melihat grafik default.
Coba ubah mark dari line ke point , area , bar , circle , square , ... (lihat dokumentasi ).
Coba sisa visualisasi Vega atau VegaLite. Anda mungkin perlu menjadikan URL mutlak, misalnya ganti "url": "data/world-110m.json" dengan "url": "https://vega.imtqy.com/editor/data/world-110m.json" (lihat catatan di bawah).
Menggunakan utilitas makelogs , buat beberapa data logstash dan coba contoh logstash ( Jangan gunakan makelog pada kluster produksi).

Vega vs VegaLite

VegaLite adalah versi Vega yang disederhanakan, berguna untuk memulai dengan cepat, tetapi dengan sejumlah keterbatasan. VegaLite secara otomatis dikonversi ke Vega sebelum dieksekusi. Bandingkan logstash-simple_line-vega dan logstash-simple_line-vegalite (keduanya menggunakan beberapa data logstash dari Elasticsearch). Anda dapat menggunakan editor ini untuk mengonversi VegaLite ke Vega.

Pertanyaan Pencarian Elastics

Secara default, item data Vega dapat menggunakan data internal dan eksternal dengan parameter "url" . Kibana menambahkan dukungan untuk permintaan Elasticsearch langsung dengan memuat ulang nilai "url" .
Berikut adalah contoh kueri Elasticsearch yang menghitung jumlah dokumen di semua indeks. Kueri menggunakan bidang @timestamp untuk memfilter rentang waktu dan membaginya menjadi segmen histogram.

 // 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 } }

Hasil lengkap memiliki jenis struktur berikut:

 { "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 }, ...

Perhatikan bahwa "key" adalah cap waktu Unix dan dapat digunakan tanpa konversi oleh ekspresi tanggal Vega.

Untuk sebagian besar grafik, kami hanya memerlukan daftar nilai segmen, jadi kami menggunakan format: {property: "aggregations.time_buckets.buckets"} untuk fokus hanya pada data yang kami butuhkan.

Permintaan dapat ditentukan dengan rentang individu dan panel informasi kontekstual. Kueri ini setara dengan "%context%": true, "%timefield%": "@timestamp" , kecuali untuk menggeser rentang waktu 10 menit yang lalu.

 { 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%" juga dapat digunakan untuk menentukan nilai minimum atau maksimum tunggal. Seperti yang ditunjukkan di atas, extended_bounds dalam date_histogram dapat diatur dengan dua nilai - minimum dan maksimum. Daripada mengkodekan nilainya, Anda dapat menggunakan "min": {"%timefilter%": "min"} , yang akan ditimpa pada awal rentang waktu saat ini. shift dan unit juga didukung. "Interval" dapat diatur secara dinamis, tergantung pada rentang yang dipilih saat ini: "interval": {"%autointerval%": 10} akan mencoba untuk mendapatkan sekitar 10-15 titik data (segmen).

File Peta Elastis

Ini adalah kemampuan untuk mengakses file Layanan Peta Elastik menurut beberapa mekanisme.

 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"}

Vega dengan peta

Peta Kibana secara default dapat digunakan sebagai basis untuk grafik Vega. Untuk mengaktifkan, grafik harus menentukan type=map dalam konfigurasi host.

 { "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 */ }

Visualisasi ini akan secara otomatis menyematkan proyeksi yang disebut "projection" . Gunakan ini untuk menghitung posisi semua tag berorientasi geografis. Selain itu, Anda dapat menggunakan garis bujur, garis lintang dan skala. Sinyal-sinyal ini dapat digunakan dalam grafik atau dapat diperbarui untuk mengubah posisi peta.

Debugging

Browser Debug Console

Gunakan alat peramban untuk debugging (misalnya, F12 atau Ctrl + Shift + J di Chrome) untuk memeriksa variabel VEGA_DEBUG : * view - akses ke Lihat objek Vega. Lihat Panduan Debugging Vega untuk cara memeriksa data dan sinyal saat runtime. Untuk VegaLite, VEGA_DEBUG.view.data('source_0') mendapatkan kumpulan data utama. Untuk Vega, ini menggunakan nama data, yang secara spesifik dalam spesifikasi Vega Anda. * spesifikasi vega_spec dari grafik Vega JSON setelah beberapa modifikasi dari Kibana. Dalam kasus VegaLite, ini adalah output dari kompiler VegaLite. * vegalite_spec - jika itu adalah grafik VegaLite, spesifikasi JSON dari grafik tersebut sebelum mengkompilasi VegaLite

Data

Jika Anda menggunakan kueri Elasticsearch, pastikan data yang diterima sesuai dengan yang Anda harapkan. Cara termudah untuk melihat ini adalah dengan menggunakan tab "jaringan" di alat debugging browser Anda (misalnya, F12). Ubah grafik sedikit sehingga membuat permintaan pencarian dan melihat respons server. Pendekatan lain adalah dengan menggunakan tab Alat Kibana Dev - menempatkan nama indeks di dalam baris pertama: GET <INDEX_NAME>/_search , dan tambahkan permintaan Anda dengan baris berikutnya (hanya nilai bidang "query" ).
Jika Anda perlu berbagi grafik dengan seseorang, Anda dapat menyalin respons string data ke gist.github.com , mungkin dengan ekstensi .json, gunakan tombol [raw], dan gunakan url ini langsung di grafik Anda.
Untuk mencegah Vega dari menggunakan sumber data non-ES, tambahkan vega.enableExternalUrls: false ke file kibana.yml.

Tautan yang bermanfaat

Editor - termasuk contoh untuk Vega dan VegaLite, tetapi tidak mendukung fitur Kibana spesifik seperti pertanyaan Elasticsearch dan peta dasar interaktif.
Contoh tutorial , dokumen, dan VegaLite.
Buku teks , dokumen, dan contoh Vega.

Menggunakan Contoh Vega dan VegaLite

Saat menggunakan contoh Vega dan VegaLite , Anda perlu memodifikasi bagian "data" untuk menggunakan URL absolut. Misalnya, ganti "url": "data/world-110m.json" dengan "url": "https://vega.imtqy.com/editor/data/world-110m.json" . Juga, dalam contoh Vega biasa, mereka menggunakan model tata letak "autosize": "pad" , dan Kibana menggunakan fit . Hapus semua nilai autosize , width dan height . Lihat dimensi dan posisi di bawah ini.

Opsi konfigurasi tambahan

Opsi ini khusus untuk Kibana. Dukungan kartu memiliki opsi konfigurasi tambahan.

 { 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 */ }

Ukuran dan Posisi

Vega dan VegaLite.

Secara default, grafik Vega di Kibana akan menggunakan model tata letak autosize = { type: 'fit', contains: 'padding' } untuk grafik Vega dan VegaLite. Model fit menggunakan semua ruang yang tersedia, mengabaikan nilai width dan height , tetapi memperhitungkan nilai indentasi. Anda dapat mengganti perilaku ini dengan menentukan nilai autosize berbeda.

Vega di peta.

Semua grafik Vega akan mengabaikan autosize , width , height dan padding menggunakan model indentasi nol.

Inspeksi visualisasi

Banyak visualisasi memungkinkan Anda untuk memeriksa data yang mendasari visualisasi.
Untuk memeriksa visualisasi, klik tombol Inspect di editor atau pilih Inspect dari menu panel Dashboard.

Layar awal menunjukkan data dasar untuk visualisasi. Anda dapat memuat data sebagai file CSV (comma separated value) dalam format Terformat atau Raw . Data yang diformat dimuat dalam format tabel. Raw memuat data sebagaimana disajikan - tanggal sebagai cap waktu, angka tanpa pemisah keseribu, dll.

Untuk melihat permintaan yang mengumpulkan data, pilih Permintaan dari menu Lihat di kanan atas.

Tampilan apa yang tersedia tergantung pada visualisasi yang diinspeksi.

Panduan Pengguna Kibana. Visualisasi. Bagian 6