echarts需要了解的配置：series、xAxis、yAxis、grid、tooltip、title、legend、color
1、title：标题
2、tooltip：{
trigger(触发方式)：'axis'(柱状图，折线图) 'item'(散点图，饼图)
指示器配置项：指鼠标悬浮上去之后提示框的样式等
axisPointer:{ type:line,shadow,cross,none }
} 鼠标悬停上去出现的提示小框
3、legend：图例组件
4、toolbox：工具箱组件：另存为图片
toolbox: {
feature: {
saveAsImage: {}
}
},
5、gird：网格配置 可以控制图表的大小
grid:内小红盒子
DOM：外大红盒子
grid: {
left: '3%', 图表左侧距离DOM元素的距离
right: '4%',
bottom: '3%',
containLabel: true：是否显示刻度
},
6、xAixs：x轴
xAxis: {
type: 'category', ：坐标轴类型
boundaryGap: false, 坐标与坐标轴之间是否有距离
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] ：数据
},
7、yAixs：y轴
8、series：系列图表配置，它决定显示哪种类型的图表。是个数组，包含若干对象，一个对象一条线。series里有了name属性的话，可以把legend里的data删掉。
series: [
{
name: 'Email',
type: 'line', ：类型
stack: 'Total', ：总量 数据堆叠，一般不需要，有了它数据不会发生重叠
data: [120, 132, 101, 134, 90, 230, 210]
},]
饼图
series: [
{
name: 'Email',
type: 'pie', ：类型
center: ["50%", "50%"], 控制饼图的位置，第一个为左右位置，第二个为上下位置。
radius: "50%",只有一个值的时候是控制饼图的大小，两个值的时候会让饼图变为环状图，例如["50%", "20%"]
label: { 会显示什么内容，{a}：系列名,{b}：数据名,{d}：百分比,{c}：数据值 show: true,
formatter: "{b}，\n人数{c}，占比{d}%",
color: "white", },
labelLine: {引导线的长短
length: 20,
length2: 20,},
柱状图
xAxis: {
type: "value",
boundaryGap: [0, 0.01],
splitLine: {整个图形中的网格线
show: false,},
xisLine: {x轴线显不显示
show: true, },
axisLabel: {x轴上的名称
color: "#fff",},},
series:[
itemStyle: {
normal: {颜色渐变
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: "#3BDBE4" },
{ offset: 0.5, color: "#00ECF1" },
{ offset: 1, color: "#00FFFE" },
]), },},]
data: [120, 132, 101, 134, 90, 230, 210] },]
9、color：线的颜色
color：[] 是个数组
10、让图表自适应屏幕而变化
window.addEventListener("resize",function() =>{
myChart.resize();
})
