改变x轴y轴的颜色

 1             xAxis : [
 2                 {
 3                     type : 'category',
 4                     data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],    
 5                     //设置轴线的属性
 6                     axisLine:{
 7                         lineStyle:{
 8                             color:'#FF0000',
 9                             width:8,//这里是为了突出显示加上的
10                         }
11                     } 
12                 }
13             ],
14             yAxis : [
15                 {
16                     type : 'value',
17                     //设置轴线的属性
18                     axisLine:{
19                         lineStyle:{
20                             color:'#00FF00',
21                             width:8,//这里是为了突出显示加上的
22                         }
23                     } 
24                 }
25             ],
26

柱状图的宽度

1             series: [{
2                 name: '登录次数',
3                 type: 'bar',
4                 data: [500, 200, 136, 100, 90, 80, 70, 60, 50, 40],
5                 barWidth:'10px', //宽度
6                 color:'#12BA1D', //颜色
7             }]

坐标轴刻度线

1  axisTick: {           //坐标轴刻线
2     show: true
3 },

安全基线

1             visualMap: {
2                 show: true,
3                 pieces: {
4                         color: '#03d6d6',
5                     }
6             },

x轴和y轴的线条(在xAxis里设置)

1 splitLine: {
2    show: true,
3    interval: 'auto',
4     lineStyle: {
5     color: '#F6F6F6',
6      }
7  },

            legend: {
                data:['登录次数'],
                x:'650px',
            },

Echarts属性trigger:axis、axisPointer效果展示

tooltip: {
    trigger: 'axis', //触发类型；轴触发，axis则鼠标hover到一条柱状图显示全部数据，item则鼠标hover到折线点显示相应数据，
    axisPointer: {  //坐标轴指示器，坐标轴触发有效，
        type: 'line', //默认为line，line直线，cross十字准星，shadow阴影
        crossStyle: {
            color: '#fff'
        }
    }
}

改变面积区域颜色渐变

                    areaStyle:{
                                normal:{
                                    //右，下，左，上
                                    color:new echarts.graphic.LinearGradient(0,0,0,1,[
                                        {
                                            offset:0,
                                            color:'#d8fdda'
                                        },
                                        {
                                            offset:1,
                                            color:'#fbfefb'
                                        }
                                    ],false)
                                    
                                }

echarts的使用

Echarts属性trigger:axis、axisPointer效果展示

推荐阅读