echarts多图表联动

echartsDemo.js

function echartLoad(array,arrayNo){
// 路径配置
    require.config({
        paths: {
            echarts: 'http://echarts.baidu.com/build/dist'
        }
    });

    // 使用
    require(
        [
            'echarts',
            'echarts/chart/bar', // 使用柱状图就加载bar模块,按需加载
            'echarts/chart/line'
        ],
        function (ec) {
            // 基于准备好的dom,初始化echarts图表
            var myChart1 = ec.init(document.getElementById('zxPandect'));

            myChart1.setTheme("macarons");
            
            var zx1 = $("#zx1").text();
            var zx2 = $("#zx2").text();
            var zx3 = $("#zx3").text();
            var zx4 = $("#zx4").text();
            var zx5 = $("#zx5").text();
            var zx6 = $("#zx6").text();
            var zx7 = $("#zx7").text();
            var zx8 = $("#zx8").text();
            var option1 = {
                title : {
                	 x:'center',
                    text: '护士工作量专项汇总',
                    //subtext: '纯属虚构'
                },
                tooltip : {
                    trigger: 'axis'
                },
                xAxis : [
                    {
                        type : 'category', //x轴为类目类型
                        axisLabel:{
                            show:true,
                            interval:0,
                            rotate:10
                        },
                        data : ['注射','输液','泵入','雾化','灌肠','鼻饲','冲洗','其他']

                    }],
                yAxis : [
                    {
                        type : 'value'  //y轴为值类型
                    }
                ],
                series : [{
                    name:'专项汇总',
                    type:'line',
                    smooth:true,
                    data:[zx1,zx2,zx3,zx4,zx5,zx6,zx7,zx8]
                }],
                grid: {  
                    left: '0',  
                    right: '0',  
                    bottom: '0'  
                }  
            }
            
            var xName;
            var ecConfig = require('echarts/config'); 
            function eConsole(param) {
            	xName = param.name;
            	//单项汇总
                var xArr = new Array();
                var dArr = new Array();
                var xArr1=new Array("皮内","皮下","肌肉","静脉","静脉st");//注射
                var xArr2=new Array("宫颈","续静滴","静脉","小儿静脉");//输液
                var xArr3=new Array("注射泵","输液泵","胰岛素泵");//泵入
                var xArr4=new Array("超声雾化","氧气雾化","空气");//雾化
                var xArr5=new Array("肛门","肠造口","保留","清洁");//灌肠
                var xArr6=new Array("鼻饲","鼻管滴","肠管滴","胃管泵","肠管泵");//鼻饲
                var xArr7=new Array("膀胱","膀胱持续","胸腔","腹腔","伤口","伤口持续","胃管","造瘘管","洗胃");//冲洗
                var xArr8=new Array("肛门塞药","皮试","输血","配血","气道湿化","换瓶","拔针","巡房","核对","穿刺","主动");//其他
                
                var dx1,dx2,dx3,dx4,dx5,dx6,dx7,dx8,dx9,dx10,dx11,dx12,dx13,dx14,dx15,dx16,dx17,dx18,dx19,dx20,dx21,dx22,dx23,dx24,dx25,dx26,dx27,dx28,dx29,dx30,dx31,dx32,dx33,dx34,dx35,dx36,dx37,dx38,dx39,dx40,dx41,dx42,dx43,dx44;
                var dArr1,dArr2,dArr3,dArr4,dArr5,dArr6,dArr7,dArr8;
                
                dx1 = $("#dx1").text(); dx2 = $("#dx2").text(); dx3 = $("#dx3").text(); dx4 = $("#dx4").text(); dx5 = $("#dx5").text();
                dArr1=new Array(dx1,dx2,dx3,dx4,dx5);
                
                dx6 = $("#dx6").text(); dx7 = $("#dx7").text(); dx8 = $("#dx8").text(); dx9 = $("#dx9").text();
                dArr2=new Array(dx6,dx7,dx8,dx9);
                
                dx10 = $("#dx10").text();dx11 = $("#dx11").text(); dx12 = $("#dx12").text(); 
                dArr3=new Array(dx10,dx11,dx12);
                
                dx13 = $("#dx13").text();dx14 = $("#dx14").text(); dx15 = $("#dx15").text(); 
                dArr4=new Array(dx13,dx14,dx15);
                
                dx16 = $("#dx16").text();dx17 = $("#dx17").text(); dx18 = $("#dx18").text(); dx19 = $("#dx19").text(); 
                dArr5=new Array(dx16,dx17,dx18,dx19);
                
                dx20 = $("#dx20").text(); dx21 = $("#dx21").text();dx22 = $("#dx22").text();dx23 = $("#dx23").text();dx24 = $("#dx24").text();
                dArr6=new Array(dx20,dx21,dx22,dx23,dx24);
                
                dx25 = $("#dx25").text(); dx26 = $("#dx26").text(); dx27 = $("#dx27").text(); dx28 = $("#dx28").text();dx29 = $("#dx29").text();dx30 = $("#dx30").text(); dx31 = $("#dx31").text(); dx32 = $("#dx32").text(); dx33 = $("#dx33").text();
                dArr7=new Array(dx25,dx26,dx27,dx28,dx29,dx30,dx31,dx32,dx33);
                
                dx34 = $("#dx34").text(); dx35 = $("#dx35").text(); dx36 = $("#dx36").text(); dx37 = $("#dx37").text(); dx38 = $("#dx38").text(); dx39 = $("#dx39").text();dx40 = $("#dx40").text();dx41 = $("#dx41").text(); dx42 = $("#dx42").text(); dx43 = $("#dx43").text(); dx44 = $("#dx44").text();
                dArr8=new Array(dx34,dx35,dx36,dx37,dx38,dx39,dx40,dx41,dx42,dx43,dx44);
                
                if(xName=="注射"){ xArr = xArr1; dArr = dArr1; }else if(xName=="输液"){ xArr = xArr2; dArr = dArr2;}
                else if(xName=="泵入"){xArr = xArr3;dArr = dArr3;}else if(xName=="雾化"){xArr = xArr4;dArr = dArr4;}
                else if(xName=="灌肠"){xArr = xArr5;dArr = dArr5;}else if(xName=="鼻饲"){xArr = xArr6;dArr = dArr6;}
                else if(xName=="冲洗"){xArr = xArr7;dArr = dArr7;}else if(xName=="其他"){xArr = xArr8;dArr = dArr8;}
                else{xArr = xArr1;dArr = dArr1;}
                
                var myChart2 = ec.init(document.getElementById('dxPandect'));
                myChart2.setTheme("macarons");
                
                var option2 = {
                        title : {
                        	 x:'center',
                            text: '护士'+xName+'单项汇总'
                            //subtext: '纯属虚构'
                        },
                        tooltip : {
                            trigger: 'axis'
                        },
                        xAxis : [
                            {
                                type : 'category', //x轴为类目类型
                                axisLabel:{
                                    show:true,
                                    interval:0,
                                    rotate:10
                                },
                                data : xArr

                            }],
                        yAxis : [
                            {
                                type : 'value'  //y轴为值类型
                            }
                        ],
                        series : [{
                            name:xName,
                            type:'line',
                            smooth:true,
                            data:dArr
                        }],
                        grid: {  
                            left: '0',  
                            right: '0',  
                            bottom: '0'  
                        }  
                    }
                //事件
                myChart2.on(ecConfig.EVENT.HOVER, eConsole2);
                var tArr = new Array();
                
                var n1=0, n2=0, n3=0, n4=0, n5=0, n6=0, n7=0, n8=0, n9=0, n10=0, n11=0, n12=0,n13=0,n14=0,n15=0,n16=0,n17=0,n18=0,n19=0,n20=0;
            	var n21=0,n22=0,n23=0,n24=0,n25=0,n26=0,n27=0,n28=0,n29=0,n30=0,n31=0,n32=0,n33=0,n34=0,n35=0,n36=0,n37=0,n38=0,n39=0,n40=0,n41=0,n42=0,n43=0,n44=0,n45=0;
            	function setNum(span, num)
            	{
            		if(span.innerHTML)
            			span.innerHTML = span.innerHTML*1 + num;
            		else
            			span.innerHTML = num;
            	}
                function eConsole2(param){
                	dxName = param.name;
                	
                	var tArr1=new Array();var tArr2=new Array();var tArr3=new Array();var tArr4=new Array();var tArr5=new Array();var tArr6=new Array();
                	var tArr7=new Array();var tArr8=new Array();var tArr9=new Array();var tArr10=new Array();var tArr11=new Array();var tArr12=new Array();
                	var tArr13=new Array();var tArr14=new Array();var tArr15=new Array();var tArr16=new Array();var tArr17=new Array();var tArr18=new Array();
                	var tArr19=new Array();var tArr20=new Array();var tArr21=new Array();var tArr22=new Array();var tArr23=new Array();var tArr24=new Array();
                	var tArr25=new Array();var tArr26=new Array();var tArr27=new Array();var tArr28=new Array();var tArr29=new Array();var tArr30=new Array();
                	var tArr31=new Array();var tArr32=new Array();var tArr33=new Array();var tArr34=new Array();var tArr35=new Array();var tArr36=new Array();
                	var tArr37=new Array();var tArr38=new Array();var tArr39=new Array();var tArr40=new Array();var tArr41=new Array();var tArr42=new Array();
                	var tArr43=new Array();var tArr44=new Array();var tArr45=new Array();
                	
                	for(var j=0;j<arrayNo.length;j++){
                    	var t1= $(arrayNo[j]+"").getElementsByClassName("tt")[1].innerHTML*1;
                    	var t2= $(arrayNo[j]+"").getElementsByClassName("tt")[2].innerHTML*1;
                    	var t3= $(arrayNo[j]+"").getElementsByClassName("tt")[3].innerHTML*1;
                    	var t4= $(arrayNo[j]+"").getElementsByClassName("tt")[4].innerHTML*1;
                    	var t5= $(arrayNo[j]+"").getElementsByClassName("tt")[5].innerHTML*1;
                    	var t6= $(arrayNo[j]+"").getElementsByClassName("tt")[6].innerHTML*1;
                    	var t7= $(arrayNo[j]+"").getElementsByClassName("tt")[7].innerHTML*1;
                    	var t8= $(arrayNo[j]+"").getElementsByClassName("tt")[8].innerHTML*1;
                    	var t9= $(arrayNo[j]+"").getElementsByClassName("tt")[9].innerHTML*1;
                    	var t10= $(arrayNo[j]+"").getElementsByClassName("tt")[10].innerHTML*1;
                    	var t11= $(arrayNo[j]+"").getElementsByClassName("tt")[11].innerHTML*1;
                    	var t12= $(arrayNo[j]+"").getElementsByClassName("tt")[12].innerHTML*1;
                    	var t13= $(arrayNo[j]+"").getElementsByClassName("tt")[13].innerHTML*1;
                    	var t14= $(arrayNo[j]+"").getElementsByClassName("tt")[14].innerHTML*1;
                    	var t15= $(arrayNo[j]+"").getElementsByClassName("tt")[15].innerHTML*1;
                    	var t16= $(arrayNo[j]+"").getElementsByClassName("tt")[16].innerHTML*1;
                    	var t17= $(arrayNo[j]+"").getElementsByClassName("tt")[17].innerHTML*1;
                    	var t18= $(arrayNo[j]+"").getElementsByClassName("tt")[18].innerHTML*1;
                    	var t19= $(arrayNo[j]+"").getElementsByClassName("tt")[19].innerHTML*1;
                    	var t20= $(arrayNo[j]+"").getElementsByClassName("tt")[20].innerHTML*1;
                    	var t21= $(arrayNo[j]+"").getElementsByClassName("tt")[21].innerHTML*1;
                    	var t22= $(arrayNo[j]+"").getElementsByClassName("tt")[22].innerHTML*1;
                    	var t23= $(arrayNo[j]+"").getElementsByClassName("tt")[23].innerHTML*1;
                    	var t24= $(arrayNo[j]+"").getElementsByClassName("tt")[24].innerHTML*1;
                    	var t25= $(arrayNo[j]+"").getElementsByClassName("tt")[25].innerHTML*1;
                    	var t26= $(arrayNo[j]+"").getElementsByClassName("tt")[26].innerHTML*1;
                    	var t27= $(arrayNo[j]+"").getElementsByClassName("tt")[27].innerHTML*1;
                    	var t28= $(arrayNo[j]+"").getElementsByClassName("tt")[28].innerHTML*1;
                    	var t29= $(arrayNo[j]+"").getElementsByClassName("tt")[29].innerHTML*1;
                    	var t30= $(arrayNo[j]+"").getElementsByClassName("tt")[30].innerHTML*1;
                    	var t31= $(arrayNo[j]+"").getElementsByClassName("tt")[31].innerHTML*1;
                    	var t32= $(arrayNo[j]+"").getElementsByClassName("tt")[32].innerHTML*1;
                    	var t33= $(arrayNo[j]+"").getElementsByClassName("tt")[33].innerHTML*1;
                    	var t34= $(arrayNo[j]+"").getElementsByClassName("tt")[34].innerHTML*1;
                    	var t35= $(arrayNo[j]+"").getElementsByClassName("tt")[35].innerHTML*1;
                    	var t36= $(arrayNo[j]+"").getElementsByClassName("tt")[36].innerHTML*1;
                    	var t37= $(arrayNo[j]+"").getElementsByClassName("tt")[37].innerHTML*1;
                    	var t38= $(arrayNo[j]+"").getElementsByClassName("tt")[38].innerHTML*1;
                    	var t39= $(arrayNo[j]+"").getElementsByClassName("tt")[39].innerHTML*1;
                    	var t40= $(arrayNo[j]+"").getElementsByClassName("tt")[40].innerHTML*1;
                    	var t41= $(arrayNo[j]+"").getElementsByClassName("tt")[41].innerHTML*1;
                    	var t42= $(arrayNo[j]+"").getElementsByClassName("tt")[42].innerHTML*1;
                    	var t43= $(arrayNo[j]+"").getElementsByClassName("tt")[43].innerHTML*1;
                    	var t44= $(arrayNo[j]+"").getElementsByClassName("tt")[44].innerHTML*1;
                    	var t45= $(arrayNo[j]+"").getElementsByClassName("tt")[45].innerHTML*1;
                    	tArr1.push(t1);tArr2.push(t2);tArr3.push(t3);tArr4.push(t4);tArr5.push(t5);tArr6.push(t6);tArr7.push(t7);tArr8.push(t8);tArr9.push(t9);
                    	tArr10.push(t10);tArr11.push(t11);tArr12.push(t12);tArr13.push(t13);tArr14.push(t14);tArr15.push(t15);tArr16.push(t16);tArr17.push(t17);tArr18.push(t18);
                    	tArr19.push(t19);tArr20.push(t20);tArr21.push(t21);tArr22.push(t22);tArr23.push(t23);tArr24.push(t24);tArr25.push(t25);tArr26.push(t26);tArr27.push(t27);
                    	tArr28.push(t28);tArr29.push(t29);tArr30.push(t30);tArr31.push(t31);tArr32.push(t32);tArr33.push(t33);tArr34.push(t34);tArr35.push(t35);tArr36.push(t36);
                    	tArr37.push(t37);tArr38.push(t38);tArr39.push(t39);tArr40.push(t40);tArr41.push(t41);tArr42.push(t42);tArr43.push(t43);tArr44.push(t44);tArr45.push(t45);
                    }
                	if(dxName=="皮内"){tArr=tArr1}
                	else if(dxName=="皮下"){tArr=tArr2}
                	else if(dxName=="肌肉"){tArr=tArr3}
                	else if(dxName=="静脉"){tArr=tArr4}
                	else if(dxName=="静脉st"){tArr=tArr5}
                	else if(dxName=="续静滴"){tArr=tArr6}
                	else if(dxName=="静脉"){tArr=tArr7}
                	else if(dxName=="小儿静脉"){tArr=tArr8}
                	else if(dxName=="宫颈"){tArr=tArr9}
                	else if(dxName=="皮试"){tArr=tArr10}
                	else if(dxName=="注射泵"){tArr=tArr11}
                	else if(dxName=="输液泵"){tArr=tArr12}
                	else if(dxName=="胰岛素泵"){tArr=tArr13}
                	else if(dxName=="超声雾化"){tArr=tArr14}
                	else if(dxName=="氧气雾化"){tArr=tArr15}
                	else if(dxName=="空气"){tArr=tArr16}
                	else if(dxName=="肛门"){tArr=tArr17}
                	else if(dxName=="肠造口"){tArr=tArr19}
                	else if(dxName=="保留"){tArr=tArr18}
                	else if(dxName=="清洁"){tArr=tArr20}
                	else if(dxName=="肛门塞药"){tArr=tArr21}
                	else if(dxName=="鼻饲"){tArr=tArr22}
                	else if(dxName=="胃管滴"){tArr=tArr23}
                	else if(dxName=="肠管滴"){tArr=tArr24}
                	else if(dxName=="胃管泵"){tArr=tArr25}
                	else if(dxName=="肠管泵"){tArr=tArr26}
                	else if(dxName=="膀胱"){tArr=tArr27}
                	else if(dxName=="膀胱持续"){tArr=tArr28}
                	else if(dxName=="胸腔"){tArr=tArr29}
                	else if(dxName=="腹腔"){tArr=tArr30}
                	else if(dxName=="伤口"){tArr=tArr31}
                	else if(dxName=="伤口持续"){tArr=tArr32}
                	else if(dxName=="胃管"){tArr=tArr33}
                	else if(dxName=="造瘘管"){tArr=tArr34}
                	else if(dxName=="输血"){tArr=tArr35}
                	else if(dxName=="配血"){tArr=tArr36}
                	else if(dxName=="膀胱灌注"){tArr=tArr37}
                	else if(dxName=="洗胃"){tArr=tArr38}
                	else if(dxName=="气道湿化"){tArr=tArr39}
                	else if(dxName.indexOf("换瓶")>-1){tArr=tArr45}
                	else if(dxName=="拔针"){tArr=tArr40}
                	else if(dxName.indexOf("巡房")>-1){tArr=tArr41}
                	else if(dxName.indexOf("核对")>-1){tArr=tArr42}
                	else if(dxName=="穿刺"){tArr=tArr43}
                	else if(dxName.indexOf("主动")>-1){tArr=tArr44}
                	
                	
                    var myChart3 = ec.init(document.getElementById('ordPandect'));
                    myChart3.setTheme("macarons");
                    
                    var option3 = {
                            title : {
                            	 x:'center',
                                text: '护士'+dxName+'工作量'
                                //subtext: '纯属虚构'
                            },
                            tooltip : {
                                trigger: 'axis'
                            },
                            xAxis : [
                                {
                                    type : 'category', //x轴为类目类型
                                    axisLabel:{
                                        show:true,
                                        interval:0,
                                        rotate:10
                                    },
                                    data : array
                                }],
                            yAxis : [
                                {
                                    type : 'value'  //y轴为值类型
                                }
                            ],
                            series : [{
                                name:dxName,
                                type:'line',
                                smooth:true,
                                data:tArr
                            }],
                            grid: {  
                                left: '0',  
                                right: '0',  
                                bottom: '0'  
                            }  
                        }
                    myChart3.setOption(option3);
                }
                
                
                myChart2.setOption(option2);
            } 
            
            myChart1.on(ecConfig.EVENT.HOVER, eConsole);
            // 为echarts对象加载数据
            myChart1.setOption(option1);
            
            //联动配置
            //myChart1.connect([myChart2, myChart3,myChart4]);
        }
    );
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值