Echarts 图表的相关配置

Echarts 图表的相关配置

option1 = {
            title:{
                text:"各运检班组报备施工隐患情况",
                x:'center',
                y:"5px" ,
                textStyle: {
                    fontSize: 18,
                    fontWeight: 'bolder',
                    color: '#4FE7FE'                             // 主标题文字颜色
                },
            },
            tooltip: {
                trigger: 'item',        //由什么触发
                axisPointer: {//平行于y轴的虚线
                    type: 'cross',
                    crossStyle: {
                        color: '#999'
                    }
                },
                axisPointer: { //去掉移动的指示线
					type: 'none'
				}
            },
            toolbox: {   //切换柱形图和折线图
                feature: {
                    dataView: {show: true, readOnly: false},
                    magicType: {show: true, type: ['line', 'bar']},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            color:['#FFE400','#0AFD40','#FF7200'],
            legend: {                                  //legend的颜色是在option里面直接定义的color数组，有几个图例就在color里面写几个颜色值。
                data: ['A',
                'B', {
                    name:'C',
                    textStyle:{
                        color:'#FF7200'         //设置图例文字颜色
                    }
                }
                ],
                textStyle: {
                    color: ['#FFE400','#0AFD40']    //设置图例文字颜色
                },
                padding:[0,0,8,0],
                orient: 'horizontal',   //图例排列方式
                left: 'center',         //图例水平位置
                top:'top',           //图例垂直位置
				 //图例换行 ---  每3个是一组
				 itemGap: 10,
				 textStyle: {
				 	color: "#fff",
				 	padding: 0,
					rich:{
						a: {
							width: ($("#wqxEcharts").width() - 200) / 3,
							height:38,
							fontSize: 12
						},
					}
				//图例换行结束
            },
            grid:{                              //调整图表 位置 的方法
                x:50,
                y:50,
                x2:50,
                y2:50,
                borderWidth:1
            },
            xAxis: [
                {
                    type: 'category',
                    data: [],
                    axisPointer: {
                        type: 'shadow'
                    },
                    axisLine:{
                        lineStyle:{color:'rgb(111,167,212)'}    // x轴坐标轴颜色
                        // lineStyle:{color:'rgb(56,155,186)'}    // x轴坐标轴颜色
                    },
                    axisLabel: {
                        interval:0,//横轴信息全部显示
                        rotate:15
                    },
                    axisTick:{ //y轴刻度线
                        show:false
                    },
                    axisLabel: {
						show: true,
						textStyle: {
							color: '#B6E6F6'//x轴字体颜色
						}
					},
                //网格样式
                    splitLine: {
                        show: true,
                        lineStyle:{
                            color: ['#2447A6'],
                            width: 1,
                            type: 'solid'
                        }
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '电流',
                    nameTextStyle:{
                        color:"red", 
                        fontSize:12,
                    },
                    // min: 0,
                    // max: 250,
                    // interval: 50,
                    axisLabel: {
                        formatter: '{value}'
                    },
                    //axisLabel : {color:'rgb(150,150,150)'},    //y轴字体颜色
                    axisLine:{
                        lineStyle:{color:'rgb(82,144,190)'}  //y轴坐标轴颜色
                    },
                    axisTick:{ //y轴刻度线
                        show:false
                    },
                    splitLine :{    //网格线
                        lineStyle:{
                            // type:'dashed'    //设置网格线类型 dotted：虚线   solid:实线
                            color: ['#3178AD'],
                            width: 1,
                            type: 'solid'
                        },
                        show:true //隐藏或显示
                    }
                },
                {
                    type: 'value',
                    name: '比例',
                    min: 0,
                    max: 100,
                    interval: 20,            //间隔为5
                    axisLabel: {
                        formatter: '{value} %'
                    },
                    axisLine:{
                        lineStyle:{color:'rgb(56,155,186)'}  //y轴坐标轴颜色
                    },
                    splitLine :{    //网格线
                        lineStyle:{
                            type:'dashed'    //设置网格线类型 dotted：虚线   solid:实线
                        },
                        show:false //隐藏或显示
                    }
                }
            ],
            series: [
                {
                    name: 'A',
                    type: 'line',
                    data: [920, 832, 601, 434, 390, 830, 620],
                    itemStyle: {     //在图上显示数值
                        normal: {
                            label: {
                                show: true, //开启显示
                                position: 'top', //在上方显示
                                textStyle: { //数值样式
                                    color: 'black',
                                    fontSize: 16
                                },
                                formatter: '{c}'
                            }
                        }
                    },
                    markLine: {
                        silent: true,
                        lineStyle: {
                            normal: {
                                color: '#01fef9'                   // 这儿设置安全基线颜色
                            }
                        },
                        data : [
            　　　　　　　　{type : 'average', name: '平均值'}
                        ],
                        label: {
                            normal: {
                                padding: [-13, -20, 15, -45],//文字位置
                            //  formatter: '平均值'         // 这儿设置安全基线
                            }
                        },
                    },
                },
                {
                    name: 'B',
                    type: 'line',
                    data: [820, 932, 901, 934, 1290, 1330, 1320]
                },
                {
                    name: 'C',
                    type: 'line',
                    data: [720, 432, 601, 734, 390, 630, 420]
                }
            ]
        };
    

刚开始写，不好的地方还请各位海涵~