可视化入门学习
前言
可视化是指用于创建图形、图像或动画，以便交流沟通讯息的任何技术和方法。翻译成人话，即用图表 / 图形来代替文本描述。可视化的重点在于清晰地表述观点。那么该如何入门可视化呢？师父有言，“先去调研，看看目前的可视化组件能做到什么程度”做事前先调研，既可以对该领域有一个大致的认知，又可以避免重复造轮子，为日后能在该领域做出一些独特的贡献打下基石。
调研
1. 调研方法论
调研对象
如何弄出一套适用的评定算法 / 方法论？
先以某个成熟的大型组件为测试样例，逐一测试以下量化标准，一方面观察该组件是否符合标准，符合标准到一个什么程度；另一方面反过来思考这样的标准是否有意义，可以对标准进行一个适当地增删
对标准进行合并整理，提出可量化的方法论
量化标准：
特色（最重要且最需要关注的地方）
交互模式（在线还是离线；CS / BS / APP)
组件暴露的API是否有详细且规范的输入输出描述？（关注二次开发有无可能）
组件通用功能是否完善？有无约束和限制？动态效果怎么样？大数据渲染性能怎么样？
组件是否有人持续更新与维护？社区活跃度怎么样？（遇到问题是否容易解决）
是否有可以直接运行或者借鉴的 demo？（直接体现出效果）
是否支持离线（内网使用）？
评定组件的方法：
体验官网的各个模块 + 本地安装尝试 + 看用户生态 / 用户评价 + 探索离线部署方式
关注离线场景下的组件部署，可尝试以下方法：rancher（K8s的一个应用，底层依赖 docker 镜像）、
docker + Nexus + Gitlab、第三方云原生交付平台（阿里云、ThingJS）
行研报告 （调查不仅针对组件本身，同时也可以观察组件背后的开发者）
2. 调研示例
ECharts（侧重于图表）
作为库文件引入使用示例：
在线修改 demo 使用示例：
Echarts离线部署方案：
官网定制下载插件代码，再使用U盘 / 光盘拷贝至目的主机；
从 github 上拉取源码后，使用 cnpm 安装相应依赖。依靠 npm 可以提供内网服务，也可以引用
/echarts/dist中的 js 文件进行二次开发。
3. 调研结论
现有可视化组件类别：
图表开发。例：Echarts、Highcharts、Chart.js、react-vis、ApexCharts
图形开发。例：Antv、D3.js、billboard.js
低代码开发，实现所见即所得。例：Sugar BI、react-big-screen、vue-big-screen
模块开发，专注于某一类图表 / 图形。例：Deck.gl
现有可视化组件功能总结：
在线修改 demo 代码，将图表导出使用；
作为库文件引入前端 IDE，进行二次开发。
调研思考：
现有可视化组件涵盖了基本所需的图表类型，demo 多而全。因此对于简单的开发情景，采用“拿来主义“，使用 Echarts，Antv/g2，甚至使用 Sugar BI，都能满足要求。 但如果要面对的是高度定制化的图表开发需求，那么 D3.js / Antv 几乎是唯一的出路。因为它们是面向图形开发的可视化组件，自由度高。但相应的这一类组件几乎都有自身的图形交互语法，学习曲线比较陡峭，不适用于敏捷开发。
未来具有竞争力的开发组件应该具备以下特点：
结语
观点是可视化的灵魂；
如何向一个毫无前置知识的人，清晰地阐述一个观点，是可视化的艺术；
留心观察生活中的点滴，思考这些东西向我传递了什么观点，是以一种什么样的形式？了解别人能做什么，然后去做别人没做到的事；
在研究的开始阶段，假设拥有完美的前置条件，往往有利于研究的开展。
Last updated
