1. 程式人生 > >echarts3的簡單實踐(餅圖、柱形圖、折線圖、地圖+散點圖)

echarts3的簡單實踐(餅圖、柱形圖、折線圖、地圖+散點圖)

echarts3是向下相容echarts2的,所以echarts2切換到echarts3基本無需改程式碼。

餅圖、柱形圖、折線圖:用的echarts2的配置項,但是能正常顯示


程式碼片段:

    function loadCharts(orgCode){
    /** 構建故障原因餅圖 */
        myChart1.showLoading();    
		jQuery.ajax({
 			type: "POST",
 		    url: "#URL()/fastrepair/statistics/queryDayFaultReason",
 		    data: {orgCode:orgCode},
 		    success: function(json){
 		      var faultReason = json.result;
   
        option1 = {  
               title : {  
                   text: '主要故障原因',  
                      x:'center',
                      y:'bottom',
                      textStyle: {
                         fontFamily: 'Microsoft YaHei',
                         fontSize:12,
                         fontStyle: 'normal',
                         fontWeight: 'normal',
                         color: '#333333'
                      }  
               },  
               tooltip : {  
                   trigger: 'item',  
                   formatter: "{a} <br/>{b} : {c} ({d}%)"  
               },  
               calculable : true,
               color: ['rgb(27,208,220)','rgb(106,234,157)','rgb(109,174,239)','rgb(240,208,113)','rgb(235,97,0)'],
               series : [  
                   {  
                     name:'主要故障原因',  
                     clickable:false,
                     itemStyle: {
                       normal: {
                          label: {
                             formatter: "{b} {c}"
                          },
                          labelLine: {
                              length: 5
                          }
                       }
                     }, 
                     type:'pie',  
                     radius : '55%',  
                     center: ['50%', '40%'],  
                     data: faultReason
                   }  
               ]  
        };  
        myChart1.setOption(option1);  
        myChart1.hideLoading();
	}
});          

    /** 構建故障型別餅圖 */
        myChart2.showLoading();
		jQuery.ajax({
 			type: "POST",
 		    url: "#URL()/fastrepair/statistics/queryDayFaultType",
 		    data: {orgCode:orgCode},
 		    success: function(json){
 		    var	faultType = json.result;
          
        option2 = {  
               title : {  
                   text: '故障型別',  
                      x:'center',
                      y:'bottom',
                      textStyle: {
                         fontFamily: 'Microsoft YaHei',
                         fontSize:12,
                         fontStyle: 'normal',
                         fontWeight: 'normal',
                         color: '#333333'
                      }  
               },
               tooltip : {  
                   trigger: 'item',  
                   formatter: "{a} <br/>{b} : {c} ({d}%)"  
               },
               calculable : true,
               color: ['rgb(27,208,220)','rgb(109,174,239)','rgb(240,208,113)','rgb(235,97,0)'],
               series : [  
                   {  
                     type:'pie',  
                     name:'故障型別',  
                     clickable:false,
                     itemStyle: {
                       normal: {
                          label: {
                             formatter: "{b} {c}"
                          },
                          labelLine: {
                              length: 5
                          }
                       }
                     }, 
                     radius : '55%',  
                     center: ['50%', '40%'],  
                     data:faultType
                   }  
               ]  
        };  
        myChart2.setOption(option2); 
        myChart2.hideLoading(); 
    }
});      

    /** 構建故障來源餅圖 */
        myChart3.showLoading();
		jQuery.ajax({
 			type: "POST",
 		    url: "#URL()/fastrepair/statistics/queryDayFaultSource",
 		    data: {orgCode:orgCode},
 		    success: function(json){
 		    var	faultSource = json.result;
        option3 = {  
               title : {  
                   text: '故障來源',  
                      x:'center',
                      y:'bottom',
                      textStyle: {
                         fontFamily: 'Microsoft YaHei',
                         fontSize:12,
                         fontStyle: 'normal',
                         fontWeight: 'normal',
                         color: '#333333'
                      }  
               },  
               tooltip : {  
                   trigger: 'item',  
                   formatter: "{a} <br/>{b} : {c} ({d}%)"  
               },  
               calculable : true,
               color: ['rgb(27,208,220)','rgb(109,174,239)','rgb(240,208,113)'],
               series : [  
                   {  
                     name:'故障來源',  
                     clickable:false,
                     itemStyle: {
                       normal: {
                          label: {
                             formatter: "{b} {c}"
                          },
                          labelLine: {
                              length: 5
                          }
                       }
                     }, 
                     type:'pie',  
                     radius : '55%',  
                     center: ['50%', '40%'],  
                     data:faultSource
                   }  
               ]  
          };  
          myChart3.setOption(option3);  
          myChart3.hideLoading(); 
    }
});      

        myChart4.showLoading();
		jQuery.ajax({
 			type: "POST",
 		    url: "#URL()/fastrepair/statistics/queryDayFaultUnit",
 		    data: {orgCode:orgCode},
 		    success: function(json){
 		    var	faultUnit = json.result;
 		      var orgname =[];
              var daytotal = [];
 		      var dayrushrepair =[];
              var dayrecover = [];              
              jQuery.each(faultUnit, function(i,item){  
    	      orgname.push(item.orgname);
    	      daytotal.push(item.daytotal);
    	      dayrushrepair.push(item.dayrushrepair);
    	      dayrecover.push(item.dayrecover);
              });
          option4 = {
              tooltip : {
                  trigger: 'item'
              },
              legend: {
                  //data:['歷史未覆電','當天搶修中','當天已覆電'],
                  data:['當天搶修中','當天已覆電','當天總數'],
                  y:'bottom',
                  textStyle: {
                     fontFamily:'Microsoft YaHei'
                  }
              },
              grid:{
                 x:50,
                 x2:35,
                 y:20,
                 y2:80
              },
              xAxis : [
              {
                  type : 'category',
                  axisLine: {
                     show: false
                  },
                  axisLabel: {
                     textStyle: {
                        color: '#333',
                        fontFamily:'Microsoft YaHei'
                     }
                  },
                  axisTick : {show: false},
                  splitLine: {
                     show: false
                  },
                  splitArea: {
                     show: false
                  },
                  data : orgname
              }
              ],
              yAxis : [
              {
                  type : 'value',
                  axisLine: {
                     show: false
                  },
                  axisLabel: {
                     textStyle: {
                        color: '#333',
                        fontFamily:'Microsoft YaHei'
                     }
                  },
                  axisTick : {show: false},
                  splitLine: {
                     show: true
                  },
                  splitArea: {
                     show: false
                  }                  
              }
              ],
              series : [
/*              {
                 name:'歷史未覆電',
                 type:'bar',
                 data:[15, 8, 7, 16, 5, 7, 13],
                 itemStyle: {
                     normal: {
                         color: '#6daeef'
                     }
                 },
                 markLine : {
                     symbol: 'none',
                     precision: 1,
                     itemStyle: {
                        normal: {
                           lineStyle: {
                              type: 'dotted'
                           }
                        }
                     },                 
                    data : [
                       {type : 'average', name: '平均值'}
                    ]
                 }
              },*/
              {
                 name:'當天搶修中',
                 type:'bar',
                 data:dayrushrepair,
                 itemStyle: {
                     normal: {
                         color: '#f0d071'
                     }
                 },                 
                 markLine : {
                     symbol: 'none',
                     precision: 1,
                     itemStyle: {
                        normal: {
                           lineStyle: {
                              type: 'dotted'
                           }
                        }
                     },                 
                     data : [
                         {type : 'average', name : '平均值'}
                     ]
                 }
              },
              {
                  name:'當天已覆電',
                  type:'bar',
                  data:dayrecover,
                  itemStyle: {
                     normal: {
                         color: '#1bd0dc'
                     }
                  },                  
                  markLine : {
                     symbol: 'none',
                     precision: 1,
                     itemStyle: {
                        normal: {
                           lineStyle: {
                              type: 'dotted'
                           }
                        }
                     },
                     data : [
                        {type : 'average', name : '平均值'}
                     ]
                  }
              },
              {
                  type:'line',
                  name:'當天總數',
                  yAxisIndex: 0,
                  itemStyle: {
                     normal: {
                        color:'#0970d6'
                     }
                  },
                  data:daytotal
              }
/*              {
                  type:'line',
                  name:'歷史資料',
                  yAxisIndex: 0,
                  itemStyle: {
                     normal: {
                        color:'#f15acc'
                     }
                  },                  
                  data:[25, 26, 27, 28, 29, 30, 36]
              }*/
              ]
          };
          myChart4.setOption(option4);  
          myChart4.hideLoading(); 
     }      
});           
          
     /** 構建故障持續時間柱形圖 */
        myChart5.showLoading();
		jQuery.ajax({
 			type: "POST",
 		    url: "#URL()/fastrepair/statistics/queryDayFaultTime",
 		    data: {orgCode:orgCode},
 		    success: function(json){
 		    var	faultTime = json.result;         
          var option5 = {
               grid:{
                  x:50
               },
               xAxis : [
                         {
                              type : 'value',
                              axisLine: {
                                   show: false
                              },
                              axisTick : {show: false},
                              splitLine: {
                                     show: false
                              },
                              splitArea: {
                                   show: false
                              }                              
                         }
                       ],
               yAxis : [
                        {
                          type : 'category',
                          axisLine: {
                                 show: false
                          },
                          axisTick : {show: false},
                          splitLine: {
                                     show: true
                          },
                          splitArea: {
                                   show: false
                          },
                          data : ['2h-4h','4h-8h','>8h']
                        }
                       ],
              series : [
                          {
                            name:'故障持續時間',
                            type:'bar',
                            data:faultTime,
                            itemStyle: {
                                 normal: {
                                   color: '#1BD0DC',
                                   label : {
                                         show: true,
                                         position: 'insideRight',
                                         formatter: '{c}',
                                         textStyle: {
                                            color:'#FFF'
                                         }
                                   }
                                 }
                            }
                          }
                       ]
           };
           myChart5.setOption(option5);   
           myChart5.hideLoading(); 
     }      
});                              
}


2.柱形圖+折線圖+地圖+散點圖,這是從echarts3重新開發的




程式碼片段:

/** 載入圖表 function 
* provinceCode 省編碼
* bureau_code 局編碼
* assetType  資產型別
*/
var myChart = echarts.init(document.getElementById('main'));
var myChart1 = echarts.init(document.getElementById('main1'));
var myChart2 = echarts.init(document.getElementById('map'));
var convertData = function (data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
        var geoCoord = geoCoordMap[data[i].name];
        if (geoCoord) {
            res.push({
                name: data[i].name,
                value: geoCoord.concat(data[i].value)
            });
        }
    }
    return res;
};
var geoCoordMap = {};

function loadCharts(provinceCode,bureau_code,assetType){
var tjnybm = cui("#censusDate").getValue();	
if(!provinceCode){ provinceCode = '00';}
if(!assetType)   { assetType = 0;}
var assetTypeName ='';
if(assetType == 0){
	assetTypeName ='變電站數量';
}else if(assetType == 1){
	assetTypeName ='主變數量(臺)';	
}else if(assetType == 2){
	assetTypeName ='主變容量(MVA)';	
}else if(assetType == 3){
	assetTypeName ='斷路器數量(組)';	
}else if(assetType == 4){
	assetTypeName ='隔離開關數量(組)';	
}else if(assetType == 5){
	assetTypeName ='GIS間隔數量';	
}else if(assetType == 6){
	assetTypeName ='輸電線路長度(km)';	
}else if(assetType == 7){
	assetTypeName ='輸電線路條數';	
}else if(assetType == 8){
	assetTypeName ='配變數量(臺)';	
}else if(assetType == 9){
	assetTypeName ='配變容量(KVA)';	
}else if(assetType == 10){
	assetTypeName ='10kV饋線長度(km)';	
}else if(assetType == 11){
	assetTypeName ='10kV饋線條數';	
}
var orgCode = provinceCode;
var orgName = cui("#parentUnit").getText();
if(bureau_code){
	orgCode = bureau_code;
	orgName = cui("#childUnit").getText();
}
var param = [orgCode,tjnybm,assetType];
/** echarts圖表構建開始  */
//構建資產規模分佈
myChart.showLoading();
jQuery.ajax({
		type: "POST",
	    url: "/web/assetmonitoring/assetScaleChart/queryAssetDistribution.bpms",
	    data: {'param':param},
	    traditional:true,
	    async: true,
	    dataType: 'json',  
	    success: function(data){
	    var distributionList =	data.distributionList;	
	    var dydj =[];
	    var total = [];
	    var add =[];
	    jQuery.each(distributionList, function(i,item){  
	    	dydj.push(item.dimName);
	    	total.push(item.assetTotal);
	    	add.push(item.assetNew);
        });
option = {
    title: {
        text: ((assetTypeName.indexOf("(")!=-1?assetTypeName.substring(0,assetTypeName.indexOf("(")):assetTypeName)+'的資產規模分佈'+assetTypeName.substring(assetTypeName.indexOf("("),assetTypeName.indexOf(")")+1))+'('+tjnybm.substr(0,4)+'年'+tjnybm.substr(4,2)+'月)',
        textStyle: {fontSize:14,fontWeight:'normal'},
        subtext:'\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n'+orgName,
        subtextStyle: {
        	color:'#000'
        },
        top:'top',
        left:'center'
    },
//    animation:false,
    grid:{
    	left:60
    },    
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'none'
        }
    },
    xAxis: [
        {
            type: 'category',
			data: dydj,
			axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis: [
        {
        	name:'總數',
            type: 'value',
			splitNumber:4,
            axisLabel: {
                formatter: '{value} '
            }
        },
        {
        	name:'新增',
            type: 'value',	
			splitNumber:4,
            axisLabel: {
                formatter: '{value} '
            }
        }
    ],
    series: [
        {
            type:'bar',
            name:'總數',
            data:total,
			barWidth:'20%',
			itemStyle:{
			  normal :{
			     color:'#4F94CD'
			  },
			  emphasis: {
			     color:'#4876FF'
			  }
			}
        },
        {
            type:'line',
            name:'新增',
			yAxisIndex: 1,
            data:add,
			itemStyle: {
                normal: {color: '#188df0'}
            }
        }
    ]
};
myChart.setOption(option);
myChart.hideLoading();
}
});	 

//構建資產規模趨勢
myChart1.showLoading();
jQuery.ajax({
	type: "POST",
    url: "/web/assetmonitoring/assetScaleChart/queryAssetTrend.bpms",
    data: {'param':param},
    traditional:true,
    async: true,
    dataType: 'json',  
    success: function(data){
    var trendList =	data.trendList;	
    var tjnybm1 =[];
    var total = [];
    var add =[];
    jQuery.each(trendList, function(i,item){  
    	tjnybm1.push(item.tjnybm);
    	total.push(item.assetTotal);
    	add.push(item.assetNew);
    });
option1 = {
    title: {
        text: ((assetTypeName.indexOf("(")!=-1?assetTypeName.substring(0,assetTypeName.indexOf("(")):assetTypeName)+'的資產規模趨勢'+assetTypeName.substring(assetTypeName.indexOf("("),assetTypeName.indexOf(")")+1))+'('+tjnybm.substr(0,4)+'年'+tjnybm.substr(4,2)+'月)',
        textStyle: {fontSize:14,fontWeight:'normal'},
        subtext:'\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n'+orgName,
        subtextStyle: {
        	color:'#000'
        },
        top:'top',
        left:'center'
    },
//    animation:false,
    grid:{
    	left:60
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {
            type: 'none'
        }
    },
    xAxis: [
        {
            type: 'category',
			data: tjnybm1,
			axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis: [
        {
        	name:'總數',
            type: 'value',
			splitNumber:4,
            axisLabel: {
                formatter: '{value} '
            }
        },
        {
        	name:'新增',
            type: 'value',
			splitNumber:4,
            axisLabel: {
                formatter: '{value} '
            }
        }
    ],
    series: [
        {
            type:'bar',
            name:'總數',
            data:total,
			barWidth:'20%',
			itemStyle:{
			  normal :{
			     color:'#4F94CD'
			  },
			  emphasis: {
			     color:'#4876FF'
			  }
			}
        },
        {
            type:'line',
            name:'新增',
			yAxisIndex: 1,
            data:add,
			itemStyle: {
                normal: {color: '#188df0'}
            }
        }
    ]
};
myChart1.setOption(option1);
myChart1.hideLoading();
}
});	 


/** 構建對比分析地圖  */
if(bureau_code && bureau_code.length==2){
	provinceCode = bureau_code;
}
var param2 = [provinceCode,tjnybm,assetType];

myChart2.showLoading();
jQuery.ajax({
	type: "POST",
    url: "/web/assetmonitoring/assetScaleChart/queryAssetCompare.bpms",
    data: {'param':param2},
    traditional:true,
    async: true,
    dataType: 'json',
    success: function(result){
    var compareList =	result.compareList;	
    var data =[];
    jQuery.each(compareList, function(i,item){ 
        var objdata = {};
        objdata.name=item.dimName;
        objdata.value=item.assetTotal;
    	data.push(objdata);
    });  
var mapJsonName;
var mapJson = getMapJson(provinceCode);
mapJsonName =mapJson[0].name;
geoCoordMap =mapJson[1].geo;

//載入地圖
option3 = {
    title: {
        text: ((assetTypeName.indexOf("(")!=-1?assetTypeName.substring(0,assetTypeName.indexOf("(")):assetTypeName)+'的單位對比分析'+assetTypeName.substring(assetTypeName.indexOf("("),assetTypeName.indexOf(")")+1))+'('+tjnybm.substr(0,4)+'年'+tjnybm.substr(4,2)+'月)',
        textStyle: {fontSize:18,fontWeight:'normal'},
        top:'top',
        left:'center'
    },
//    animation:false,
    tooltip : {
        trigger: 'item'
    },
    geo: {
        map: mapJsonName,
        selectedMode:'single',
        label: {
            normal: {
                show: false
            },
            emphasis: {
                show: false
            }
        },        
        itemStyle: {
            normal: {
                areaColor: '#D1EEEE'
            },
            emphasis: {
                areaColor: '#6495ED'
            }
        }
    },    
    series: [
             {
                 type: 'scatter',
                 coordinateSystem: 'geo',
                 data: convertData(data),
                 symbolSize: 20,
                 hoverAnimation: true,
                 symbolSize: function (val) {
                     return (val[2] / (compareList[0].assetTotal) *100)> 30?(val[2] / (compareList[0].assetTotal) *250):(val[2] / (compareList[0].assetTotal) *300);
                 },
                 label: {
                     normal: {
                         formatter: function (params) {
                             return params.name + '\n ' + params.value[2];
                         },
                         position: 'inside',
                         show: true,
                         textStyle:{color:'#000'}
                     }
                 },
                 itemStyle: {
                     normal: {
                         color: '#5CACEE'
                     },
                     emphasis: {
                    	 color: '#FF8C00'
                     }
                 },
                 tooltip : {
                     formatter: function (params) {
                         return params.name + ' : ' + params.value[2];
                     }
                 },
                 zlevel: 1
             },
             {
            	 type:'map',
            	 geoIndex:0,
            	 data: data,
            	 tooltip : {
                     formatter: function (params) {
                         return params.name + (isNaN(params.value)?'':(':'+params.value));
                     }
            	 }    
             },
             {
            	 type:'pie',
            	 center: ['90%','10%'],
            	 radius: 45,
                 label: {
                     normal: {
                         show: (mapJsonName=='NW'?false:true),
                         position: 'center',
                         formatter: '{b}',
                         textStyle: {
                        	 color:'#4F94CD',
                        	 fontSize:14
                         }
                     },
                     emphasis: {
                         show: (mapJsonName=='NW'?false:true),
                         position: 'center',
                         formatter: '{b}',
                         textStyle: {
                        	 color:'#4F94CD',
                        	 fontSize:14
                         }
                     }
                 },
                 itemStyle:{
                     normal: {
                         color: '#fff'
                     }            	 
                 },
                 data:[
                       {value:0,name:'返回南方電網'}
                 ],
                 tooltip: {
                	 formatter:'{b}'
                 }
             }   
/*              {
            	 type:'pie',
            	 center: ['10%','90%'],
                 radius: [35,45],
                 avoidLabelOverlap: false,
                 stillShowZeroSum:true,
                 label: {
                     normal: {
                         show: true,
                         position: 'inside',
                         formatter: '{c}\n\n\n\n\n{b}',
                         textStyle: {
                        	 color:'#000',
                        	 fontWeight:'bold',
                        	 fontSize:16
                         }
                     },
                     emphasis: {
                         show: true,
                         position: 'inside',
                         formatter: '{c}\n\n\n\n\n{b}',
                         textStyle: {
                        	 color:'#000',
                        	 fontWeight:'bold',
                        	 fontSize:16
                         }
                     }
                 },
                 itemStyle:{
                     normal: {
                         color: '#4F94CD'
                     }            	 
                 },
                 data:[
                       {value:compareList[0].assetTotal, name:(compareList[0].dimName.substr(0,6))}
                 ],
                 tooltip: {
                	 formatter:'{b}:{c}'
                 }
             } */
     ]
  }
  
$.get('geoJson/'+mapJsonName+'.json', function (geoJson) {
  echarts.registerMap(mapJsonName, geoJson);
  myChart2.setOption(option3);
  myChart2.hideLoading();
    myChart2.dispatchAction({
	    type: 'downplay',
	    seriesIndex: 0
    });
    myChart2.dispatchAction({
	    type: 'downplay',
	    seriesIndex: 1
    }); 
  //如果選了地市則高亮
  if(bureau_code.length>2){
	myChart2.dispatchAction({
        type: 'highlight',
        seriesIndex: 0,
        name: cui("#childUnit").getText()
   });
	myChart2.dispatchAction({
        type: 'highlight',
        seriesIndex: 1,
        name: cui("#childUnit").getText()
   });
  }
});
}
});
}
/** echarts圖表構建結束  */

//地圖點選事件
function mapClick(){
myChart2.on('click', function (params){
	if(params.seriesType == 'scatter' || params.seriesType=="map"  || params.seriesType=="pie"){
	var tjnybm = cui("#censusDate").getValue();	
	var tjnybm2 = cui("#censusDate").getValue();
	var assetType = cui("#assetTypeInput").getValue();	
	var mapJson = getMapJson(params.name);	
	//點選網省
	if(mapJson[0].name){
		mapJsonName =mapJson[0].name;
		geoCoordMap =mapJson[1].geo;
      $.get('geoJson/'+mapJsonName+'.json', function (geoJson) {
    	  echarts.registerMap(mapJsonName, geoJson);
    	  option3.geo.map = mapJsonName;    	  
    	  var orgCode = mapJson[2].code;
    	  var param3 = [orgCode,tjnybm2,assetType];
    	  myChart2.showLoading();
    	  jQuery.ajax({
    			type: "POST",
    		    url: "/web/assetmonitoring/assetScaleChart/queryAssetCompare.bpms",
    		    data: {'param':param3},
    		    traditional:true,
    		    async: true,
    		    dataType: 'json',
    		    success: function(result){
    		    var compareList =	result.compareList;	
    		    var data =[];
    		    jQuery.each(compareList, function(i,item){ 
    		        var objdata = {};
    		        objdata.name=item.dimName;
    		        objdata.value=item.assetTotal;
    		    	data.push(objdata);
    		    });  
    	    	option3.series[0].data = convertData(data);
    	    	option3.series[1].data = data;
    	    	//設定圓環圖表
/*      	    var data1 =[];
    	    	var objdata ={};
    	    	objdata.value = compareList[0].assetTotal;
    	    	objdata.name = compareList[0].dimName.substr(0,6);
    	    	data1.push(objdata);
    	    	option3.series[1].data = data1;  */
    	        myChart2.setOption(option3);
    	        myChart2.hideLoading();
    		    }
    	  })
      })
    }//點選地市局
	else{
    	//高亮地市局區域和散點
    	myChart2.dispatchAction({
            type: 'highlight',
            seriesIndex: 0,
            name: params.name.substr(0,2)
        });
    	myChart2.dispatchAction({
            type: 'highlight',
            seriesIndex: 1,
            name: params.name.substr(0,2)
        });
    }
	//重新整理分佈和趨勢圖表
	//查詢組織機構ID
	var dimId;
	jQuery.ajax({
		type: "POST",
	    url: "/web/assetmonitoring/assetScaleChart/queryDimIdByName.bpms",
	    data: {'param':params.name.substr(0,2)},
	    async: false,
	    dataType: 'json',  
	    success: function(data){
	    var dimIdList =	data.dimIdList;	
	    if(dimIdList.length>0){
	    jQuery.each(dimIdList, function(i,item){  
	    	dimId = item;
        });
		if(dimId.length>0 && dimId.length<=2){
			cui("#parentUnit").setValue(dimId);
		}else if(dimId.length>=4){
			cui("#childUnit").setValue(dimId);
		}
		}else{
			dimId ='00';
			cui("#parentUnit").setValue(dimId);
			cui("#childUnit").setValue('');
		}
	    }
	});
	var param4 = [dimId,tjnybm,assetType];
	myChart.showLoading();
	jQuery.ajax({
		type: "POST",
	    url: "/web/assetmonitoring/assetScaleChart/queryAssetDistribution.bpms",
	    data: {'param':param4},
	    traditional:true,
	    async: true,
	    dataType: 'json',  
	    success: function(data){
	    var distributionList =	data.distributionList;	
	    var dydj =[];
	    var total = [];
	    var add =[];
	    jQuery.each(distributionList, function(i,item){  
	    	dydj.push(item.dimName);
	    	total.push(item.assetTotal);
	    	add.push(item.assetNew);
        });
	    option.series[0].data = total;
	    option.series[1].data = add;
	    option.xAxis[0].data = dydj;
	    option.title.subtext = '\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n'+params.name.substr(0,2);
	    myChart.setOption(option);
	    myChart.hideLoading();
	    }
	});  
	myChart1.showLoading();
	jQuery.ajax({
	type: "POST",
    url: "/web/assetmonitoring/assetScaleChart/queryAssetTrend.bpms",
    data: {'param':param4},
    traditional:true,
    async: true,
    dataType: 'json',  
    success: function(data){
    var trendList =	data.trendList;	
    var tjnybm3 =[];
    var total = [];
    var add =[];
    jQuery.each(trendList, function(i,item){  
    	tjnybm3.push(item.tjnybm);
    	total.push(item.assetTotal);
    	add.push(item.assetNew);
    });
    option1.series[0].data = total;
    option1.series[1].data = add;
    option1.xAxis[0].data = tjnybm3;
    option1.title.subtext = '\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n'+params.name.substr(0,2);
    myChart1.setOption(option1);
    myChart1.hideLoading();
    }
	})
	
	//呼叫列表重新整理
	if(dimId.length>0 && dimId.length<=2){
		buttonClick()
	}else{
	   cui("#assetScaleGrid").loadData();
	   sumTypebuttonClick(assetType,true)
	}  
	
}});
}


//獲取Map需載入的mapJSON名,組織編號,散點座標資料
function getMapJson(provinceCode){
	var mapJsonCode ={};
	var mapJsonName ={};
	var geoCoordMap1 ={};
	if(provinceCode == '00'){
		mapJsonName.name ='NW';
		mapJsonCode.code = '00';
		geoCoordMap1.geo = {
			    '廣東':[114.105952,24.004227],
			    '雲南':[102.212251,24.240609],
			    '貴州':[106.713478,26.578343],
			    '海南':[109.50119,19.231971],
			    '廣西':[108.720004,23.22402],
			    '廣州':[112.622414,22.519643],
			    '深圳':[114.085947,22.247],
			    '超高壓':[114.985947,22.747]
		};
	}else if(provinceCode == '03' || provinceCode=="廣東"){
			mapJsonCode.code = '03';
			mapJsonName.name  ='GD';
			geoCoordMap1.geo = {
			        '汕頭':[116.608463,23.37102],
				    '佛山':[113.122717,23.028762],
				    '珠海':[113.553986,22.224979],
				    '深圳':[114.085947,22.547],
				    '韶關':[113.591544,24.801322],
				    '廣州':[113.280637,23.125178],
				    '肇慶':[112.472529,23.451546],
					'梅州':[116.117582,24.299112],
					'江門':[112.594942,22.090431],
					'湛江':[110.364977,21.274898],
					'茂名':[110.919229,21.659751],
					'惠州':[114.412599,23.079404],
					'陽江':[111.975107,21.859222],
					'河源':[114.697802,23.746266],
					'中山':[113.382391,22.521113],
					'潮州':[116.832301,23.861701],
					'揭陽':[116.055733,23.443778],
					'雲浮':[112.044439,22.929801],
					'汕尾':[115.364238,22.774485],
					'東莞':[113.746262,23.046237],
					'清遠':[113.051227,23.685022]
			};	
	}else if(provinceCode == '04' || provinceCode=="廣西" ){
			mapJsonName.name  ='GX';
			mapJsonCode.code = '04';
			geoCoordMap1.geo = {
			        '柳州':[109.411703,24.314617],
				    '防城港':[108.345478,21.614631],
				    '梧州':[111.297604,23.474803],
				    '桂林':[110.299121,25.274215],
				    '北海':[109.119254,21.473343],
				    '南寧':[108.320004,22.82402],
				    '貴港':[109.602146,23.0936],
					'賀州':[111.552056,24.414141],
					'百色':[106.616285,23.897742],
					'欽州':[108.624175,21.967127],
					'玉林':[110.154393,22.63136],
					'來賓':[109.229772,23.733766],
					'崇左':[107.353926,22.404108],
					'河池':[108.062105,24.695899]
			};	
	}else if(provinceCode == '05'  || provinceCode=="雲南"){
			mapJsonName.name  ='YN';
			mapJsonCode.code = '05' ;
			geoCoordMap1.geo = {
			        '保山':[99.167133,25.111802],
				    '曲靖':[103.797851,25.501557],
				    '昭通':[103.717216,27.336999],
				    '昆明':[102.712251,25.040609],
				    '麗江':[100.233026,26.872108],
				    '玉溪':[102.543907,24.350461],
				    '臨滄':[100.08697,23.886567],
					'楚雄':[101.546046,25.041988],
					'文山':[104.24401,23.66951],
					'文山電力':[104.24401,23.26951],
					'大理':[100.225668,25.589449],
					'紅河':[103.384182,23.366775],
					'普洱':[100.972344,22.777321],
					'版納':[100.797941,22.001724],
					'德巨集':[98.578363,24.436694],
					'怒江':[98.854304,25.850949],
					'迪慶':[99.706463,27.826853]
			};	
	}else if(provinceCode == '06'  || provinceCode=="貴州"){
			mapJsonName.name  ='GZ';
			mapJsonCode.code = '06';
			geoCoordMap1.geo = {
			        '安順':[105.932188,26.245544],
				    '貴陽':[106.713478,26.578343],
				    '輸電執行檢修分公司':[106.713478,26.878343],
				    '六盤水':[104.846743,26.584643],
				    '銅仁':[109.191555,27.718346],
				    '畢節':[105.28501,27.301693],
				    '遵義':[106.937265,27.706626],
				    '興義':[104.897971,25.08812],
					'凱里':[107.977488,26.583352],
					'都勻':[107.517156,26.258219],
					'貴安':[106.217156,26.358219]
			};	
	}else if(provinceCode == '07'  || provinceCode=="海南"){
			mapJsonName.name  ='HN';
			mapJsonCode.code = '07';
			geoCoordMap1.geo = {
			        '海口':[110.33119,20.031971],
				    '儋州':[109.576782,19.517486],
				    '瓊海':[110.466785,19.246011],
				    '三亞':[109.508268,18.247872],
				    '五指山':[109.516662,18.776921],
				    '文昌':[110.753975,19.612986],
					'東方':[108.653789,19.10198],
				    '萬寧':[110.388793,18.796216],
					'定安':[110.349235,19.684966],
					'屯昌':[110.102773,19.362916],
					'澄邁':[110.007147,19.737095],
					'臨高':[109.687697,19.908293],
					'昌江':[109.053351,19.260968],
					'白沙':[109.452606,19.224584],
					'陵水':[110.037218,18.505006],
					'樂東':[109.175444,18.74758],
					'保亭':[109.70245,18.636371],
					'瓊中':[109.839996,19.03557],
					'三沙':[112.34882,16.831039]
			};	
	}else if(provinceCode == '08'  || provinceCode=="廣州"){
			mapJsonName.name  ='GZS';
			mapJsonCode.code = '08';
			geoCoordMap1.geo = {
			        '荔灣':[113.243038,23.124943],
				    '越秀':[113.280714,23.125624],
				    '海珠':[113.262008,23.103131],
				    '白雲':[113.262831,23.162281],
				    '天河':[113.335367,23.13559],
				    '黃埔':[113.450761,23.103239],
					'南沙':[113.53738,22.794531],
				    '番禺':[113.364619,22.938582],
					'花都':[113.211184,23.39205],
					'增城':[113.829579,23.290497],
					'從化':[113.587386,23.545283]
			};	
	}else if(provinceCode == '09'  || provinceCode=="深圳"){
			mapJsonName.name  ='SZ';
			mapJsonCode.code = '09';
			geoCoordMap1.geo = {
			        '福田':[114.05096,22.541009],
				    '龍崗':[114.251372,22.721511],
				    '鹽田':[114.235366,22.555069],
				    '羅湖':[114.123885,22.555341],
				    '南山':[113.92943,22.531221],
				    '寶安':[113.828671,22.754741],
					'龍華':[114.044346,22.691963],
				    '坪山':[114.338441,22.69423]
			};	
	}else if(provinceCode == '01'  || provinceCode=="超高壓"){
		mapJsonName.name  ='NW';
		mapJsonCode.code = '01';
		geoCoordMap1.geo = {
		        '廣州局':[112.622414,22.719643],
			    '貴陽局':[106.713478,26.578343],
			    '南寧局':[108.320004,22.82402],
			    '柳州局':[109.411703,24.314617],
			    '梧州局':[111.297604,23.474803],
			    '百色局':[106.616285,23.897742],
				'天生橋局':[104.897971,25.08812],
			    '曲靖局':[103.797851,25.501557],
			    '昆明局':[102.712251,25.040609],
			    '大理局':[100.225668,25.589449]
		};	
    }
	    var json=[];
	    json.push(mapJsonName);
	    json.push(geoCoordMap1);
	    json.push(mapJsonCode);
	    return json;
}