这是我参与「第五届青训营 」伴学笔记创作活动的第 15 天
什么是数据可视化
数据可视化可理解为通过图表的形式来呈现数据集。也就是用图来代替数据集,学术的讲的可以理解为把信息映射成视觉效果的过程。
为什么要进行数据可视化:
我们利用视觉获取的信息量,远远比别的感官要多得多。同时数据可视化能够在小空间中展示大规模数据
数据可视化的目的
是对数据进行可视化处理,以使得能够明确地、有效地传递信息。
数据可视化的作用与意义
作用: 记录信息,分析推理,信息传播与协同
分类: 科学可视化,信息可视化,可视分析学
可视化设计的基本原则
- 能正确表达数据中的信息而不产生偏差与歧义
- 节省笔墨
- 节省空间
- 消除不必要的“无价值”图形
- 在最短的时间内传达更多的信息
使用场景:通用报表 ,移动端图表,大屏可视化,图编辑分析,地理可视化
常见的JS库: D3,js(入手难)、echarts.js(WPS)、highcharts.js(OFFICE)
echarts使用五部曲
1**、**下载并引入echarts.js文件
浏览器下载
npm下载
在线定制
2、装备一个具备大小的DOM容器——生成的图标会放到这个容器中
3、初始化实例对象——实例化echarts对象
4、指定配置项和数据
5、将配置项设置给实例对象
配置项相关说明
title 标题
tooltip 提示框组件
legend 图例组件
toolbox 工具栏
grid 网格
containlabel是刻度
xAxis x轴
yAxis y轴
color 调色盘
color:[ ' pink','blue',‘green ',' skyblue', 'red'],
serise 系列列表
type 类型
line线
bar柱
pie饼
name 系列名字
data 数据的一个数组(相关说明)
stack 数据堆叠
第二个=第一个+第二个
第三个=第一个+第二个 +第三个