echar 多级Y轴

            var StartTime = $("#StartTime").val();
            var EndTime = $("#EndTime").val();
            var CharX = [];
            var SportCheckCount = [];
            var SpanTimeSum = [];
            var Target = [];
            var Max = 0;
            var DonehundredMax = 0;
            $.ajax({
                url: '../FrockSpotCheckEcharReportForms/GetCharDatalist',
                data: { StartTime: StartTime, EndTime: EndTime },
                datatype: 'json',
                type: 'post',
                success: function (res)
                 {
                    var Charlist = res.Charlist;
                    for (var i = 0; i < Charlist.length; i++) 
                    {
                        Target.push(Charlist[i].TargetValue);
                        CharX.push(Charlist[i].charID + "日");
                        //if (Charlist[i].SportCheckCount =0)
                        //{
                        //    SportCheckCount.push(0)
                        //    SpanTimeSum.push(0);

                        //}
                        SportCheckCount.push(parseInt(Charlist[i].SportCheckCount / 3));
                        SpanTimeSum.push((Charlist[i].SportCheckCount / (3 * Charlist[i].SpanTimeSum)).toFixed(2));

                        if (parseInt(Charlist[i].SportCheckCount / 3) > Max) {
                            Max = parseInt(Charlist[i].SportCheckCount / 3);
                        }
                        if ((Charlist[i].SportCheckCount / (3 * Charlist[i].SpanTimeSum)).toFixed(2) > DonehundredMax) {
                            DonehundredMax = (Charlist[i].SportCheckCount / (3 * Charlist[i].SpanTimeSum)).toFixed(2);
                        }
                    }


                    var option = {
                        title: [
                            {
                                text: '工装点检数及单小时完成率',  //大标题
                                //subtext: '本月数据',  //类似于副标题
                                x: 'center'                 //标题位置   居中
                            }
                        ],
                        grid: {
                            top: '20%',
                            left: '0%',
                            right: '2%',
                            bottom: '0px',
                            containLabel: true
                        },
                        tooltip: {
                            trigger: 'axis',
                            //axisPointer: {
                            //    type: 'cross',
                            //    crossStyle: {
                            //        color: '#999'
                            //    }
                            //}
                        },
                        legend: {
                            data: [
                                { name: '工装数量', icon: 'circle' },
                                { name: '单小时完成率' },
                                { name: '单小时完成率目标值' },
                            ],
                            top: 50,
                            //textStyle: {
                            //    color: '#ffffff',
                            //    fontSize: 11
                            //},
                            //y: 'bottom',
                            //x: 'center',
                            y: 'top',
                            x: 'center'
                        },
                        backgroundColor: {
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 0,
                            y2: 1,
                            colorStops: [{
                                offset: 0, color: 'rgba(70, 131, 254, 0)' // 0% 处的颜色
                            }, {
                                offset: 1, color: 'rgba(70, 131, 254, 0.5)' // 100% 处的颜色
                            }],
                            global: false // 缺省为 false
                        },
                        toolbox: {
                            show: true,
                            feature: {
                                dataView: { show: true, readOnly: false },
                                magicType: { show: true, type: ['line', 'bar'] },
                                restore: { show: true },
                                saveAsImage: { show: true }
                            }
                        },
                        xAxis: [
                            {
                                type: 'category',
                                data: CharX,
                                //bounderyGap: false,
                                //axisLabel: {
                                //    interval: 0,//横轴信息全部显示
                                //    textStyle: {
                                //        color: '#fff'
                                //    },
                                //    fontSize: 11,
                                //    // rotate:45,//度角倾斜显示
                                //    //formatter: function (value) {
                                //    //    return value.length > 5 ? value.substring(0, 5) + '...' : value;
                                //    //}
                                //}
                            }
                        ],
                        yAxis: [
                            {
                                type: 'value',
                                name: '工装数量',
                                min: 0,
                                max: Max + 50,
                                interval: 50,
                                axisLabel: {
                                    formatter: '{value} '
                                }

                            },
                            {
                                type: 'value',
                                name: '单小时完成率',
                                min: 0,
                                max: parseInt(DonehundredMax) + 2,
                                interval: 1,
                                axisLabel:
                                {
                                    formatter: '{value} '
                                }

                            }
                        ],
                        series: [
                            {
                                yAxisIndex: 0,
                                //barWidth: '30%',
                                name: '工装数量',
                                type: 'bar',
                                data: SportCheckCount,
                                itemStyle: {
                                    normal: {
                                        label: {
                                            show: true,
                                            position: 'top',
                                            textStyle: {

                                                color: 'black',
                                                fontSize: 16

                                            }
                                        },
                                        lineStyle: {
                                            color: '#5184F2',

                                        },
                                        color: '#5184F2',

                                    },

                                },
                            },

                            {
                                //symbol: 'circle',
                                symbolSize: 8, //折线点的大小
                                yAxisIndex: 1,
                                name: '单小时完成率',
                                type: 'line',
                                data: SpanTimeSum,
                                itemStyle: {
                                    normal: {
                                        label: {
                                            show: true,
                                            position: 'bottom',
                                            textStyle: {

                                                color: '#E09C19',
                                                fontSize: 16

                                            }
                                        },
                                        lineStyle: {
                                            color: '#E09C19'
                                        },
                                        color: '#FF991E',
                                    }
                                }
                            }
                            ,
                            {
                                symbolSize: 0, //折线点的大小
                                yAxisIndex: 1,
                                name: '单小时完成率目标值',
                                type: 'line',
                                data: Target,
                                itemStyle: {
                                    normal: {
                                        //label: {
                                        //    show: true,
                                        //    position: 'bottom',
                                        //    textStyle: {

                                        //        color: '#',
                                        //        fontSize: 16

                                        //    }
                                        //},
                                        lineStyle: {
                                            color: 'blue'
                                        },
                                        color: 'blue',
                                    }
                                }




                            }


                        ],

                    };

                    // 基于准备好的dom,初始化echarts实例
                    var myChart = echarts.init(document.getElementById('SportCheck'));
                    myChart.setOption(option);

                }
            })

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值