手把手教你数据可视化

数据可视化，通过视觉的方式让数据变得易于理解和处理，是BI周期里面非常重要的一环，将数据库中每一个数据项作为单个图元元素表示，大量的数据集构成数据图像，同时将数据的各个属性值以多维数据的形式表示，可以从不同的维度观察数据，从而对数据进行更深入的观察和分析。

目前传统IT行业的巨头都可以提供成熟的商业BI工具及全套解决方案，如重量级的bo、cognos、biee等，稍轻量级的tableau、microstrategy、qlikview等。这些产品的可视化的确非常强大，同时价格不菲，学习成本、维护成本也很高，可扩展性相对也较差。

为了能让用户快速、自助定制自己的可视化，我们开发了基于大数据的可视化平台iview。

技术架构

考虑到系统的扩展方便，如连接更多种类的数据源，页面展示不同种类的图表。系统后端采用 springmvc+mybaits基础架构。系统的安全性，我们采用spring security进行安全访问控制，spring aop对权限控制和系统日志监控。采用spring quartz定时预处理数据及发送用户邮件订阅。

针对大量数据处理、查询慢的问题，系统采用数据预加载模式，将数据批量加载到缓存服务，之后的数据查询都是从缓存服务读取。加载过的数据会在缓存服务器中缓存48小时，避免二次查询重复获取数据，并且数据集可以定时预加载，最大化的减少用户查询等待时间。对于缓存服务器里的数据，不是最新数据库数据的情况，系统设置了用户手动刷新缓存数据的接口。

由于系统需要对大量数据进行条件筛选查询、排序、聚合运算、分页查询，采用Mongodb作为缓存服务器。MongoDB 是一个面向文档存储的数据库，操作起来比较简单和容易，支持丰富的查询表达式，能够高性能的进行数据存储检索。采用druid连接池，系统可以支持JDBC协议的各种数据产品，具有灵活的可扩展性，实现系统定义好的数据接口，返回指定格式的json字符串，就可以添加不同类型的数据源。

前端采用angularjs mvc, 实现数据访问和图表制作分离的模式。采用Echarts、D3绘制图表，bootstrap响应式页面布局。

解锁ivew玩法

第一步：创建数据源

添加之前确认系统WEB-INF\lib下面是否已经包含了对应的JDBC驱动包，若没有需要添加对应驱动包。填写完毕之后可以点击页面上的测试按钮，返回测试结果，判断数据源是否可用。

第二步：创建数据集

支持先进行数据的处理，最后根据数据处理的结果定义查询，以及将查询聚合后再计算。预定义的数据集可以在用户数据模型相同的前提下进行复用，可以减少相同数据集下不同表报设计时重复的填写查询脚本、聚合运算的工作，以及提高dashboard加载效率。设置实时时间，可以对数据预处理，加载到缓存，留空则不做定时加载。首次处理数据的时间由sql语句性能决定，所以请尽量优化自己的sql语句。

第三步：创建图表

选择之前创建好的数据集，通过拖拉拽的方式即可完成图表的制作。点击可选表达式，用户可以添加聚合运算的表达式，拖到指标的输入框，就可以展示聚合结果。

最后一步：看板设计

前期的准备工作已经完成，最后我们将要展示到页面的图表添加到面板。同时还可以添加图表的查询条件，并为查询条件设置默认值。看板设计采用简单行列布局模式，每行总宽度为12，每列对应一个图表，行高度可以设置，单位为px。列高度继承行高，列宽度可以自定义，但单列的总宽度不能超过12，否则在页面上会换行显示。

看板上的查询参数是根据数据集来设置的，对应参数值的操作类型包括>, =,

系统优势

1. 支持常用图表与表格，交叉表、折线图、柱状图、饼图、KPI图、漏斗图、桑基图、雷达图、仪表盘、字符云、地图、热力图等各种dashboard。

2. 简单易学，通过简单的配置，和拖拉拽的方式即可完成图表的制作。

3. 可对查询条件设定默认值。同时设置各种形式的邮件订阅。

4. 采用缓存机制，从TB级数据中预处理（类似于MOLAP），提高数据查询效率。

5. 针对数据进行分析处理，查询、聚合运算。现已支持千万级的数据秒级展现。

6. 支持主流的impala、hive、kylin及各种关系型数据库。

7. 完善的权限管理，精细到针对单个图表的查看权限。

8. 可与第三方系统无缝集成，通过传参、token等方式获取图表。

9. 接入心跳监控及HA负载，确保web server的高可用。

后记

iview系统到目前运行半年多，创建了1000+数据集，1000+报表，每天定时处理2000+数据预处理，每天发送300+邮件订阅。移动端应用开发中，敬请期待...