数据可视化分析应用 DMap开发手记之架构篇

引言

本文是 TalkingData 可视化团队郝振佳原创的一篇文章，介绍了 DMap（谛听）架构开发的相关内容。

近几个月在开发一个基于 Vue 的数据可视化分析辅助应用———DMap(谛听)，一套为数据分析师和数据科学家提供的基于位置大数据分析的工具，旨在提高数据分析效率，降低获取多数据并行分析成本，简化大屏和数据报告开发制作流程。UI 组件使用的是 iView，地图可视化库使用的是 inMap，服务端使用 Node.js 搭建。

随着 DMap 第一期开发接近尾声，也邀请一些同事进行了一些初步的试用，越来越多的同事听说了 DMap，同时也可能有一个疑问，DMap 到底是干什么的？和 InMap 又有什么区别能？作为从头参与了 DMap 开发的前端之一，我就从一个程序员的角度谈谈自己的理解。

DMap（谛听）是什么？

和 inMap 有什么区别？

DMap(谛听)是一个专注于位置相关大数据的数据可视化平台。我们公司的数据资产乃至大数据行业的数据大部分都是给予位置的数据，DMap(谛听)以给予位置的大数据的地理分析为核心，兼顾图表分析等传统数据可视化手段，并在此基础上构建数据报告、大屏应用的能力。现阶段，对于我们公司内部而言，可以满足数据分析师和数据科学家的数据分析及可视化需求，并能够在不久的将来以 JS-SDK 的形式提高相似应用的开发效率。

与 inMap 相比，inMap 是一个面向前端开发者的一个地理大数据可视化框架，而 DMap(谛听)可以说是一个面向用户的数据可视化平台，跟希望能够通过简单的配置而不是写代码的方式来快速的生成一个地理可视化应用。而 inMap 正是 DMap(谛听)的核心可视化框架之一。

DMap 产品需求

DMap 从产品需求上将，如下图所示，主要可以分为数据准备、地理分析、图表分析、主控台四个大的模块。

其中，数据准备模块主要用于数据的上传和管理，地理分析和图表分析模块用于创建地理分析和图表分析应用，然后地理分析和图表分析应用可以通过主控台应用编辑器组合成如下图所示的主控台类应用。

DMap 技术架构解析

DMap 从产品上分为的四个模块，在实际开发过程中，鉴于地理分析应用，图表分析应用和主控台应用具有一定得相似性，都是由一个编辑器和一个展示模块组成，因此，DMap 主要分成了数据和应用两大部分，具体架构如下：

1）数据准备

数据准备部分主要由数据上传、数据处理、数据展示三个模块组成。

数据上传模块，主要负责不同格式数据源的上传，解析，并将之转换统一的格式存储。

目前，数据上传部分已经完成 csv 格式、从 ATM 系统下载下来的 gz 压缩包以及直接从表格复制粘贴，被我们称之为闪电粘贴功能的支持。

数据处理模块，主要负责对上传的数据集的数据质量进行初步统计分析，数据列的数据类型识别，以及后面地理分析需要用到的经纬度等关键列的自动识别。

数据展示模块，主要是对上传的数据集详情以及数据质量的展示。其中针对地理类大数据的特点，我们提供了表格和地图两种数据详情的展示方式。并且可以在表格上，对系统识别出来的列数据类型、关键列等信息进行确认和修改。后面，我们还将提供数据集单条数据的修改功能。

2）应用部分

目前，应用主要包括地理分析应用，图表分析应用和主控台应用三种类型。

关于应用，主要有配置和数据两部分组成。而由于基于地理类大数据的数据集的的文件大小都比较大，接口请求比较耗时，为了最大程度的减少接口请求，我们将数据缓存到了数据池中进行集中管理。

应用的配置主要有对应的应用编辑器来完成。在编辑器中，主要分成了数据集信息，左侧关键配置项、右侧次要配置项，中间应用展示区域四部分。

应用的配置有可以细分为样式相关和展示逻辑相关的配置。为了使用户能快速的配置出漂亮的应用，我们将样式相关的配置组合在一起，抽象出了模板的概念，用户直接选择对应模块，即可能快速的配置出漂亮的应用。因此，我们将应用的子类型，模板和数据分析维度作为主要配置项放到左侧。而其他的配置项，作为可收起的次要配置项放在右侧。

地理分析应用和图表分析应用分作以 InMap 和 ECharts 作为底层展示引擎，为了使之能够适应 DMap 的业务需要，同时也为了便于后面的业务的扩展及调整，我们在业务与底层引擎之间封装了对应的转换中间层。转换中间层将编辑器生成的配置项，转换为引擎所需要的配置和数据，以便于应用的展示。另外，后面为了提高类似模块的开发效率，我们还计划了以 JS-SDK 的方式直接数据类似地理应用的二次开发能力。

主控台应用由地理分析应用和图表分析应用组成。主控台编辑器通过对应用的布局、样式及对应的子应用进行配置生成主控台应用。其中，对应的子应用的展示有相应的展示组件完成。以达到主控台应用与子应用逻辑分离。

以上就是我对 DMap(谛听)系统目前的架构体系的一点理解，不足之处，欢迎指正。