Echart画折线图各标签讲解

option = {
    title: {
        text: '标签讲解',//图标标题
        x: 'center'//水平居中
    },
    tooltip: {//提示框信息
        axisPointer: {
            type: 'cross'
        }
    },
    legend: {//图例信息
        data:[ 'A','B','C'],
        top:40//图例位置(可设置top,bottom,left,right)
    },
    grid: {//图的位置
        top: 100,
        bottom: 50
    },
    xAxis: [  //x坐标轴信息    
        {
           name : '(下方x轴数据单位)',//坐标单位
           data: [  "2013", "2014", "2015", "2016"]//坐标上数值
        },{
            name : '(上方x轴数据单位)',
            data: [ "2013", "2014", "2015", "2016"]
        }
    ],
    yAxis: [//y坐标轴信息
        {
            name : '(y轴数据单位)',//坐标单位
            type: 'value',
            min:600,//坐标起始值
            max:1800  //坐标最大值
        }
    ],
    series: [
        {//A曲线
            name:'A',
            type:'line',
            itemStyle:{ 
                normal:{ color: "#d14a61" } //坐标圆点的颜色
            }, 
            lineStyle:{ 
                normal:{ width:4,color: "#d14a61"  }//线条的颜色及宽度
            },
            label: {//线条上的数字提示信息
                normal: {
                    show: true,
                    position: 'top'
                }
            },
            smooth: true,//线条平滑
            data: [1180,1244,1207,1276]
        },
        {
            name:'B',
            type:'line',
            itemStyle:{ 
                normal:{ color: "#5793f3" } 
            }, 
            lineStyle:{ 
                normal:{width:4, color: "#5793f3"  } 
            },
            label: {
                normal: {
                    show: true,
                    position: 'bottom'
                }
            },
            smooth: true,
            data: [1074,1448,1125,1570]
        },{
            name:'C',
            type:'line',
            xAxisIndex: 1,
            itemStyle:{ 
                normal:{ color: "#675bba" } 
            }, 
            lineStyle:{ 
                normal:{width:4, color: "#675bba"  } 
            },
            label: {
                normal: {
                    show: true,
                    position: 'bottom'
                }
            },
            smooth: true,
            data: [887,997,854,711]
        }
    ]
};

你可能感兴趣的:(一般技巧)