关于使用ECharts一些基础

前言

ECharts 一个使用 JavaScript 实现的开源可视化库, 在前端咱们可使用这个库绘制各类可视化图表。咱们须要掌握一些基本的数据知识，这些基本的数据知识可以帮助咱们更好的理解和使用ECharts

函数

无论你是高中仍是大学毕业，对于数学中的函数，应该都是很熟悉的。所谓的函数 其实就是一种映射关系，x经过必定的转换规则f获得y。 其中一个函数包含三个要素 定义域X、值域Y和对应法则f，咱们可以使用下面的方式来表示

y = f(x)

其中 ,

拿数据可视化来讲，咱们是不能把数据原封不动的变成图形展现给用户查看。好比一个数据是10000, 难道咱们须要在页面上定义10000px的像素的图形给用户么。很明显咱们不能这样作。咱们须要把这个 10000 进行一系列的转化，变成100px或者10px或者其余高度。在可视化中，咱们追求的不是一个绝对的，而是一个相对的。像这样： A的数值是100，B的数值是200。如今须要绘制这两个数据的柱状图，咱们只须要很明显的告诉咱们的用户，B的高度是A的两倍便可。而其中A绘制的高度是否为100px，不是咱们须要关心的事情。而函数就是咱们对数据进行转换的一个利器，可以帮助咱们把数据相对的转化为页面展现的图形

数据类型

在数据可视化中, 数据能够分为 连续型 与 离散型两种类型

咱们怎么去理解这两个数据类型呢。举个例子, 如今咱们有某个商品一周的销售额

日期	Mon	Tue	Wed	Thu	Fri	Sat	Sun
销售额	820	932	901	934	1290	1330	1320

上面咱们看日期这个维度下面， 周一，周二，周三，周四...... 是个整数的单位(天)，咱们没法继续往下划分。
有人会有疑惑，一天怎么会分不下去呢， 一天会有24个小时，一个小时会有60分钟，分钟到秒，秒到毫秒...... 明明能够无限分下去。这样说是能够分下去，可是它的维度就不是日期了，而是时刻了。在日期的维度下，最小的整数单位就是天，每一天当作一个离散数据点，这种能够理解为离散型。

继续看咱们的表格，在每个日期的下面，有它所对应的销售额。好比周一的销售额是820，周二的销售额是932, 周三的销售额就是901。 这些数据咱们没法肯定的它的最小维度是多少。它们是存在一个区间中，好比上面的销售额。 咱们能够理解为[0, +无穷)。它能够落在这个范围内的任何地方。这种能够认为是连续型。

拿echart中最基本的折线图来看：

其中数据的销售额是连续型，从[0-1500]中，咱们从里面找到任意一个数据，都能映射到Y轴一个对应的高度。
， 而且这个高度是惟一的。咱们把其中的销售额做为x, 高度做为y，那么函数就是

y = x * k + d

其中x的定义域就是[0, 1500], y的值域就是[0, 图表的高度]。 咱们已经知道其中的两个点，K 和 d 就可以算出来。
因而，经过上面的函数就能计算出任意一点的高度。

X轴的日期就是离散型。总共只有7个点，把X轴分层7个等份，Mon获取第一等份，Tue获取第二等份，以此类推......