echarts 折线图柱状图的坐标轴的颜⾊及样式的设置
转载⽹址见：
基本⽤法请查看echarts 官⽹。
⼀、图例legend 的设置。
1.字体和颜⾊的设置
2.
样式的设置
  可以根据需求⾃⼰设置。
⼆、⼯具箱toolbox 的设置
三、tooltip 悬浮提⽰框
三、x 轴坐标xAxis 的字体颜⾊⼤⼩，坐标线颜⾊，以及⽹格线的设置1
2
3
4textStyle:{                fontSize:15,                color: '#fff'            }1
2
3
4
5
6
7
8
9legend: {            data:systemName,            itemWidth:40,            itemHeight:20,            textStyle:{                fontSize:15,                color: '#fff'            }        }1
2
3
4
5
6
textstyle
7
8
9
10
11{    type:  'line' ,    lineStyle: {        color:  '#48b' ,        width: 2,        type:  'solid'    },    textStyle:{      color: '#fff'    }}
四、yAsix 的设置相同1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22xAxis : [            {                type:  'category' ,                boundaryGap:  false  ,                data: time,                splitLine:{show:  false  }, //去除⽹格线                splitArea : {show :  true  }, //保留⽹格区域                axisLine: {                    lineStyle: {                        type:  'solid' ,                        color:  '#fff' , //左边线的颜⾊                        width: '2' //坐标线的宽度                    }                },                axisLabel: {                    textStyle: {                        color:  '#fff' , //坐标值得具体的颜⾊                      }                }            }        ]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19yAxis : [            {                type :  'value' ,                splitLine:{show:  false  }, //去除⽹格线                splitArea : {show :  true  }, //保留⽹格区域                axisLine: {                    lineStyle: {                        type:  'solid' ,                        color: '#fff' ,                        width: '2'                    }                },                axisLabel: {                    textStyle: {                        color:  '#fff'                    }                }            }        ]

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。