前端可视化开发(一)- 开篇

前言:

本系列文章会讲诉我这一年来,独立开发了一个项目叫数据可视化,附上连接[https://github.com/chuxiaoguo...],欢迎你们star,市面上现阶段能够看到相似的有,html

固然还有其余的,这里就不过多介绍了。前端

那什么是数据可视化,我我的的理解就是枯燥乏味的大数据经过图表的丰富展现,以一种快速,易懂的形式展现给用户,通常的应用场景就是数据展现,告警提醒,实时消息推送等。
固然我这个项目的规划还能经过对图表的控制,经过物联,控制硬件设备。数据可视化只是一个模块,它还能囊括组件事件交互,定制行业组件,造成一套行业定制方案。相似scada。vue

项目准备工做

需求的整理和蓝图的构建,这里咱们用思惟导图规划一下git

clipboard.png

项目

咱们认为一个项目就是你即将构建的一个系统,或一个可视化项目github

页面

若是将整个项目比喻为一颗系统树,那么项目就是根节点,那么页面就是子节点了,顾名思义,页面就是项目中的一个个的页面。segmentfault

图元

图元是最基础的元素,构成页面的基本元素就是图元,它是丰富的,能够是图表,能够是基础的图形,能够是表格,能够3D的图形... 只要你愿意,万物皆图元。框架

组件

组件分为内置组件,和用户组件,区别就是用户组件是用户生成并添加的,内置组件就是编辑器内置的。组件是由一个或多个图元组件并构建的。编辑器

工具

工具指编辑器画布内的功能,工具中有历史,粘贴板,删除等功能,这些丰富的功能能提升用户构建大屏项目的效率。工具

母版

母版跟组件是很像的,区别在于母版具有一改全改的功能,相似静态属性同样的。大数据

这里是大概的规划,之后对于元素,组件,页面,项目等的细节咱们会从新梳理,可是大致方向就是这样的。

目标

咱们要基于这些的基础,打造一个配置可视化的编辑器,固然若是你想作原型设计或是uml也是能够支持的,由于它足够灵活。

下一期我将给你们介绍如何经过vue构建基础的模型编辑器框架,以及框架应该如何选择。

下一篇 前端可视化开发(二)- 框架选择

相关文章
相关标签/搜索