kibana研究

时间：2018-12-20 21:06:37 阅读：608 评论：0 收藏：0 [点我收藏+]

概述

Kibana是一个针对Elasticsearch的开源分析及可视化平台，用来搜索、查看交互存储在Elasticsearch索引中的数据。它操作简单，基于浏览器的用户界面可以快速创建仪表板（dashboard）实时显示Elasticsearch查询动态。

安装部署kibana

kibana需要64位操作系统，并且需要先安装Elasticsearch，运行Elasticsearch又需要先安装java。

参考资料：

Elasticsearch guide
Kibana guide

下面以mac上安装部署kibana为例：

1.安装java。到java里面下载对应的最新java版本，并安装。

2.安装并运行elasticsearch。到download elasticsearch里面下载对应的最新elasticsearch版本，解压之后进入elasticsearch文件夹运行命令：./bin/elasticsearch。

3.查看elasticsearch是否运行成功。浏览器打开elasticsearch默认地址：http://localhost:9200/，如果显示如下信息则表示运行成功：

{
  "name" : "Cv0Qzv6",
  "cluster_name" : "elasticsearch",
  "cluster_uuid" : "LFNZ-yjkRRW4dcVyuWlbug",
  "version" : {
    "number" : "6.5.3",
    "build_flavor" : "default",
    "build_type" : "tar",
    "build_hash" : "159a78a",
    "build_date" : "2018-12-06T20:11:28.826501Z",
    "build_snapshot" : false,
    "lucene_version" : "7.5.0",
    "minimum_wire_compatibility_version" : "5.6.0",
    "minimum_index_compatibility_version" : "5.0.0"
  },
  "tagline" : "You Know, for Search"
}

4.安装并运行kibana。到download kibana里面下载对应的最新kibana版本，解压之后进入kibana文件夹运行命令：./bin/kibana。

5.查看kibana是否运行成功。在浏览器打开kibana默认地址：http://localhost:5601，如果能够打开kibana则表示kibana运行成功。

6.添加数据。首次打开kibana会提示导入数据，直接倒入demo data即可。然后就可以愉快的调教kibana了。

kibana的大致结构

kibana是开源的，但是只能用于elastic公司的项目。从这里可以看到kibana的源码：elastic/kibana。

kibana的大致结构如下：

整体框架：React 和 Angular 结合使用(利用ngReact库在Angular里面内嵌React)。
ui框架：EUI。Elastic公司自己开发的一套UI，开源，但是不是MIT协议，只能用于Elastic公司开发的产品。https://github.com/elastic/eui。
可视化框架：D3和Vega。D3官网和 vega官网。
使用的拖拽库：react-grid-layout。
word cloud用的d3-cloud。优点是能够自动把文本直接转化为word cloud。
实现angular里面使用react的库：ngreact。

kibana的主要功能

主要研究kibana的visualize和dashboard两个板块。
visualize板块的功能：
- 可以增加或删除自定义的展示图表。
- 可以给这些展示图表自定义配色方案，标题等。
- 可以把这个图表分享出去或者内嵌出去。
dashboard板块的功能：
- 自定义添加visualize里面的图表，或者添加saved searches数据。
- 每个图表或者数据是一个panel，支持panel的自定义拖拽排序和改变大小。
- 拥有fileters，queries，time picker三种功能，通过搭配这三种可以实时改变panel中的展示。
- 可以在dashboard里面针对具体visualization跳转到visualize板块修改对应的visualization。
- 通过点击panel中的不同位置，可以快捷的实现dashboard的filters操作。
- 可以通过右飘窗实时查看panel里面的数据。
- 可以把这个dashboard分享出去或者内嵌出去。

说明：visualization指的是visualize板块里面那样的展示图表，saved searches指的是储存的数据，它在dashboard里面以表格的形式展示出来。

kibana的数据结构

为了实现上面的主要功能，kibana有如下的数据结构：

ES

通过一个index储存这三类数据：saved searches, visualizations and dashboards。

saved searches：是用户自定义的查询数据，可以通过visualize板块转化为图表，也可以在dashboards里面查看纯数据。
visualizations：是用户在visualize板块定义的图表数据，包括使用哪个searches，以及自定义配色等。
dashboards：是用户在dashboards板块定义的dashboards数据，包括dashboard标题，里面有哪些visualizations或者saved searches。

embeddables

kibana把所有能放在dashboard上的数据都叫做embeddable，按我的理解就是visualization 和 saved searches的数据。

每个embeddable数据包含2类数据：

一个是embeddable metadata，它是不变的，包括所有embeddable的配置部分，供用户配置使用；
另一个是embeddable state，它是可变的，是用户对于某个visualization或者saved data的配置信息，比如saved object id，visualization的配色方案等。

注意：embeddable state里面有没有具体查询出来的数据？我觉得应该有，还应该有相应的查询条件。

通过embeddable state，kibana实现了2个功能：

可以通过在url里面添加这些state的参数的形式把visualization分享或者内嵌出去。
通过把这些state和dashboard的state进行交互：实现改变dashboard能够实时改变并且定制panel，比如说定制panel的标题。并且通过panel也可以改变dashboard的filters。

dashboards

每个dashboard都有2类数据：

一个是dashboard storage data，这是储存在ES中的data，用来提供给panel进行更新，并不放在redux里面。
另一个是dashboard redux tree，这是dashboard的redux的data，它包含如下几个方面：
metadata。这里修改dashboard的标题和描述。
embeddables。这里放置embeddable state里面redux感兴趣的部分数据，主要把embeddable里面的数据传给dashboard。
panels。这里用来删除panel，增加panel，更新panel，修改panel标题，重置panel标题。
view。这里用来实现fileters，queries，time picker三种功能，还有开启kibana的编辑模式，panel全屏观看等。

dashboards和panel的数据交互

在panel方面，通过dashboard的redux提供的redux来修改dashboard的数据。
在dashboard方面，把dashboard storage data通过lodash的_cloneDeep分发给各个panel，每个panel内部再利用lodash的_isequal来比较新旧data来确定更不更新展示，或者利用redux tree的一部分数据来修改panel的展示。（比如自定义panel的标题等。）
对于dashboard storage data，每个panel都有一个id，然后更新的时候dashboard会把所有panel的id聚合在一起，再加上查询条件，上传给服务器，服务器就返回新的数据，然后通过2来更新panel。当点击save的时候，这些数据就保存为这个dashboard的dashboard storage data。（实际上，kibana实现了如下的包装：savedObjects，savedDashboard，savedSearch等等）