Elastic Visulization 提供了强大的可视化工具供咱们来展现及分析数据，可是 Elastic Canvas能够给咱们提供大屏幕显示的方式，并提供了无限的联想。它可让咱们自由地定制咱们想要的大屏幕。在今天的文章中，咱们来说述一下如何实现一个简单的Canvas示例。web
关于Elasticsearch、Kibana相关安装能够查看前文：微信
咱们先打开咱们的 Kibana，并导入数据：
工具
点击上面的Load a data set and a Kibana dashboard:学习
这样咱们就导入了咱们的Sample web logs索引数据。字体
咱们点击Visualize:
flex
点击上面的Create visualziation:
点击Pie visualization:
选择咱们刚刚导入的kibana_sample_data_logs:
按照上面所示的配置，并在options里选择“Show labels”，这样就能够造成如上图所示的Pie形的前5个访问最多的网址。咱们点击上面的Save保存上面的visualization 为v-1。
按照一样的方法，咱们可针对hour_of_day来造成一个对天天每一个小时的访问图，不过此次咱们使用的是Line visualization：
咱们按照上面的配置能够生成每一个小时的访问量的分布图。上面显示天天的10点到14点是访问最繁忙的时段。咱们可点击下面的Add连接来添加一个新的bucket来展现最热的5个访问网址：
在上面显示的是访问最多的5个网址的按照一天24个小时显示的访问量的统计图。咱们保存当前的visualization为v-2。
依据上面的v-1及v-2两个visualization，咱们很容易生成咱们但愿的一个Dashboard：
点击上面的Create dashboard:
咱们点击Add，并添加v-1及v-2两个visualization：
在绝大多数的状况下，咱们的这个Dashboard已经很是漂亮了。可是对于一些大屏幕的需求，咱们很但愿有本身个性化的屏幕展现。那么问题来了，咱们该如何实现这个嗯？答案是Canvas。顾名思义，做为一个Canvas，咱们能够在画布上任意拖拽安排咱们的Widget。能够定制咱们的字体，背景等等。在接下来的教程中，咱们来作一个简单的展现。
打开Kibana，咱们点击Canvas:
点击上面的Create workpad：
咱们点击上面的Background，并选择咱们喜欢的颜色，好比黑色。咱们点击上面的Add element：
咱们选择Donut chart:
咱们选择Elasticsearch SQL，并输入以下的查询：
SELECT COUNT(timestamp) as total_visitors, host.keyword FROM kibana_sample_data_logs GROUP BY host.keyword
为了可以展现和我上面的同样，咱们须要作一些特别定制的配置。咱们在Display页面作以下的配置：
这样，咱们就完成了第一个Pie的数据展现。咱们再次选择Add element按钮。咱们此次选择Line chart：
选择上面的Line chart:
咱们点击上面的Demo data:
此次咱们一样选择Elasticsearch SQL:
SELECT COUNT(timestamp) as total_visitors, HOUR_OF_DAY(timestamp) as hour, host FROM kibana_sample_data_logs GROUP BY host, HOUR_OF_DAY(timestamp) ORDER BY HOUR_OF_DAY(timestamp) DESC
咱们能够点击Preview data查看数据：
SELECT COUNT(timestamp) as total_visitors, HOUR_OF_DAY(timestamp) as hour, host.keyword FROM kibana_sample_data_logs GROUP BY host.keyword, HOUR_OF_DAY(timestamp) ORDER BY HOUR_OF_DAY(timestamp) DESC
咱们从上面能够看出来在10点，9点total_visitors是比较多的。咱们点击到Display页面：
咱们按照上面的配置进行设置。若是你设置正确的话，你能够看到上面的显示。细心的开发者，大家可能发如今上面咱们只有一个统计的曲线。咱们点击右上角的+符号：
选择Color:
在上面咱们发现全部的线都是白色的。咱们必须把上面的Default style的颜色去掉：
咱们选择host。这样咱们就能够看到上面所示的显示。这个和咱们以前作的Dashboard很是类似。
接下来，咱们为咱们的展现添加一个title。咱们再次点击Add element。此次咱们选择Markdown:
点击上面的Text：
咱们修改在Display的内容:
咱们点击右上角的+:
咱们选择Text settings：
咱们在上面调整咱们的字体及大小。并调整文字的内容。这样最终咱们就造成了咱们想要的Canvas：
你们看一下，这个最终的Canvas的显示和咱们以前的那个 Dashboard 显然是不同的。咱们能够根据本身的需求来调整，并最终来知足咱们的需求。
有热门推荐👇
最后，分享一些比较系统的学习资料，更多资料持续更新中···：
获取方式：点击右下角 “在看” 后台回复关键词：【kubernetes】、【人工智能】、【java】、【java毕设】、【elastic】、【Elasticsearch】一键带走领取网盘连接。
本文分享自微信公众号 - 一万小时极客（coding-Hub）。
若有侵权，请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一块儿分享。