DataVis Note

HTML5 Canvas

使用标签 <canvas> 在页面创建一个 canvas 画布，一个 2D 平面，并渲染出指定的画面，如形状、图像、文字、图案等。

SVG

可缩放矢量图形 Scalable Vector Graphics，SVG 是一个由万维网联盟 W3C 自 1999 年开始开发的基于文本的开放标准，是一种基于 XML 的标记语言，用于描述二维的矢量图形，它能渲染三种类型的图形对象：矢量图形、位图、文本，并和 CSS、DOM、JavaScript 等其他网络标准无缝衔接。

D3 条形图

D3 样例图系列简介

D3 Chart Example 这个系列的文章主要是学习 D3 在 Observable 中的官方样例，逐行 line-by-line 解读样例代码。

D3 折线图

D3 散点图

D3 数据绑定

数据处理与分析

D3 数据获取与解析

D3 交互

D3 比例尺

D3 形状

D3 过渡

D3 基本流程

D3 简介

D3.js 全称为 Data-Driven Documents 是一个基于数据来操作 DOM 的 JS 库。

D3 数组模块

可视化或分析数据通常由一个数组来表示，JavaScript 原生支持多种数组操作方法

D3 坐标轴模块

坐标轴组件 Axis 可以基于比例尺 scales 生成人类友好型的刻度标尺。

D3 三角剖分模块

d3-delaunay 模块用于对点集进行三角剖分，并生成维诺图

D3 获取数据模块

Fetch 模块基于 fetch 方法添加了解析功能，内部支持 JSON、CSV、TSV 格式的数据获取与解析，也可以直接对文本使用其他形式的解析。

D3 力导向布局模块

D3 层级结构数据模块

d3-hierarchy 模块用于处理和可视化树形结构的数据

D3 路径模块

D3 提供了基本图元模块 d3-path 用于将画布 Canvas 绘制路径的方法序列化 serialize，转换为适用于 SVG 作为路径元素 path 的属性 d 的字符串。

Gephi 关系网络数据可视化

关系型数据可以分为两种结构

空间数据可视化

空间数据是指用来表示空间实体的位置、几何特征、属性特征的数据。

线性插值法

基本图标类型

数据可视化中的配色

有多种方式进行多色配色，如类似色、邻近色、对比色、互补色，基于数据可视化的目的和需求不同可以采用不同的配色方案。

数据可视化流程