对echarts的一些总结

用过很久的echarts了，总结一下坑点和不熟悉的属性的用法。

1.先安装导入，这点不用强调了

2.一定要注意给宽高（不然图是不会出来的）

3.想要什么类型的，在官网上选好了，粘出来

4.改成你想要的数据和样式

常用的就不说了，说说我最近碰到的需求写的吧，不常用，所以写的时候查了一下，记下来。

1.去掉x轴轴线，刻度线，数字颜色改变

xAxis : [

{

type : 'category',

boundaryGap : false,

axisTick:{      //x轴刻度线

show:false

},

axisLine:{          //x轴

show:false,

lineStyle: {

color: "#777D94",

}

},

data : ['00:00','06:00','12:00','18:00','24:00']

}

],

2. y轴线，刻度线，网格状，颜色

yAxis : [

{

type : 'value',

axisLabel : {

formatter: '{value} '

},

axisTick:{ //y轴刻度线

show:false

},

splitLine: { //网格线

show: false

},

axisLine:{ //y轴

show:false,

lineStyle: {

color: "#777D94",

}

},

}

],

3.柱状图的距离，颜色

series : [

{

name:'今日',

type:'bar',

barGap: 0,

data:[2.0, 4.9, 7.0, 23.2],

itemStyle:{

normal:{

color:'#5172FA'    //颜色

}

},

},

这个图

1.平滑

series : [

{

name:'昨日',

type:'line',

// symbol:'none', //这句就是去掉点的

smooth:true, //这句就是让曲线变平滑的

2. 渐变

 series : [{

name:"今日"

areaStyle: {

normal: {

color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{

offset: 0,

color: 'rgba(81,114,250,0.1)'

},

// {

// offset: 0.2,

// color: 'rgba(81,114,250,0.1)'

// },

{

offset: 1,

color: 'rgba(81,114,250,0.01)'

}

], false)

}},

}]

3.设置层级

  z:"2"