echarts绘制折线图平均线

option = {
    tooltip:{
        trigger: 'axis'    //鼠标悬浮提示
    },
    xAxis: {
        axisLabel:{
            color:"#6f6f6f"   //改变X轴坐标值颜色
        },
        axisLine:{
            lineStyle:{
                color:"#cfcfcf"   //改变x轴线颜色
            }
        },
        axisTick:{
            lineStyle:{
                color:"#cfcfcf"    //改变x轴线上的刻度颜色
            }
        },
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
        axisLabel:{
            color:"#6f6f6f"
        },
        axisLine:{
            lineStyle:{
                color:"#cfcfcf"
            }
        },
        axisTick:{
            lineStyle:{
                color:"#cfcfcf"
            }
        },
        type: 'value'
    },
    visualMap:{
        orient:"horizontal",     //图例横向展示,vertical纵向展示
        itemSymbol:"circle",     
        show:true,            //展示图例
        top:0,                //图例位置
        right:10,             //图例位置
        textGap:10,           //图例文字距离
        itemGap:20,           //图例之间距离
        itemWidth:12,         //图例图形宽度
        itemHeight:12,
        pieces:[
            {min:0,max:1100,label:"平均值之下",color:"blue",symbol:"emptyCircle"},    //设置范围区域,label是图例的名称,symbol图例的形状
            {min:1100,label:"平均值之上",color:"red",symbol:"emptyCircle"}
        ]
    },
    series: [{
        smooth:true,     //折线图展示有弧度
        symbol:"circle",   
        markLine:{       //平均线设置
            silent:true,    //true 去掉鼠标悬浮该线上的动画
            symbol:"none",   //该线无样式
            label:{
                show:false     //该线上的值去掉
            },
            lineStyle:{        //设置该线样式
                normal:{
                    type:"solid",
                    color:"#666666"
                }
            },
            data:[{
                    yAxis:1100,    //线的值
                    name:"target"
                }]
        },
        data: [820, 932, 901, 934, 1290, 1330, 802],
        type: 'line'
    }]
};

 

posted on 2020-03-11 23:54  崭新开始  阅读(7206)  评论(1编辑  收藏  举报