//name为省份的拼音，nameText为省份的中文
function showprovince(chart,objCity){
    //清除图表
    chart.clear();
    //显示loading
    chart.showLoading();
    $.get('./map/json/'+objCity.pinyin+'.json', function (geoJson) {   //地图名.json的相对位置
        echarts.registerMap(objCity.pinyin, geoJson);      //地图名的拼音
        chart.setOption(option = {
            backgroundColor: '#fff',
            title: {
                text: '电池分布',
                left: 'center',
                textStyle: {
                    color: '#000'
                }
            },
            tooltip : {
                trigger: 'item'
            },
            legend: {
                orient: 'vertical',
                x:'left'
            },
            dataRange: {
                min: 0,
                max: 2500,
                x: 'left',
                y: 'bottom',
                text:['高','低'],           // 文本，默认为数值文本
                calculable : true
            },
            toolbox: {
                show: true,
                orient : 'vertical',
                x: 'right',
                y: 'center',
                feature : {
                    mark : {show: true},
                    dataView : {show: true, readOnly: false},
                    restore : {show: true},
                    saveAsImage : {show: true}
                }
            },
            grid: {
                top:'0.1%',
                left: '0.1%',
                right: '0.1%',
                bottom: '0.1%',
                containLabel: true
            },
            mapLocation: {
                x: 'left',
                y: 'top',
                width: '100%'
            },
            series: [
                {
                    type: 'map',
                    mapType:objCity.pinyin,
                    selectedMode :'single',
                    roam: true,
                    itemStyle:{
                        normal:{label:{show:true}},
                        emphasis:{
                            label:{show:true},
                            color:'black'
                        }
                    }
                }
            ]
        });
        //隐藏loading
        chart.hideLoading();
    });
}

//创建饼状图
//pieChart为init后的容器,tle是title.text,objEle是一个数组对象，数组内的对象name和val
function createPie(pieChart,tle,objEle){
    //清理画布
    pieChart.clear();
    //定义饼状图的配置项和数据
    var option={
        title : {
            text:tle,
            x:'left',
            textStyle: {  
                fontSize:15  
            }
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        // #008000(绿色), #FF0000(红色),#FFFF00(黄色),#FFC0CB(紫色)
		color: function() {
			var sys_color = ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83',  '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'];
			var color = [];
			for(var i = 0; i < objEle.length; i++) {
				if(objEle[i].hasOwnProperty("color")) {
					color.push(objEle[i].color);
				}else {
					color.push(sys_color[i]);
				}
			}
			return color;
		}(),
        legend: {
            /*orient : 'vertical',
            x : 'left',
            data:function(){
                var lgd=new Array();
                for(var i=0;i<objEle.length;i++)
                {
                    lgd.push(objEle[i].name);
                }
                return lgd;
            }()*/
        },
        toolbox: {
            show : true,
            orient : 'vertical',
            x: 'right',
            y: 'center',
            feature : {
                mark : {show: true},
                dataView : {show: true, readOnly: false},
                magicType : {
                    show: true,
                    type: ['pie', 'funnel'],
                    option: {
                        funnel: {
                            x: '25%',
                            width: '50%',
                            funnelAlign: 'left',
                            max: 1548
                        }
                    }
                },
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        series : [
            {
                name:'电池信息',
                type:'pie',
                radius : '55%',
                center: ['50%', '60%'],
                data:function(){
                    var dataArr=new Array();
                    for(var i=0;i<objEle.length;i++)
                    {
                        var oItem={
							value:objEle[i].val,
							name:objEle[i].name,
							label: {
								normal: {
									show: true
								}
							},
							labelLine: {
								normal: {
									show: true
								},
								emphasis: {
									show: true
								}
							}
						};
						if(objEle[i].val == 0) {
							//oItem.label.normal.show = false;
							//oItem.labelLine.normal.show = false;
							//oItem.labelLine.emphasis.show = false;
						}
                        dataArr.push(oItem);
                    }
                    return dataArr;
                }()
            }
        ]
    };
    // 使用刚指定的配置项和数据显示图表。
    pieChart.setOption(option);
    pieChart.hideLoading();
}

//创建下拉框ele为下拉框，firOpt为首个option，optVal是除第一个所有的option
function createOption(ele,firOpt,optVal){
    //清除ele下的所有的option
    ele.find('option').remove();
    var __option=new Array();   //第一下拉选项的数组
    __option[0]=$('<option>'+firOpt+'</option>');   //第一个下拉选项
    if(optVal.length!=0)
    {
        //通过for循环将下拉选项的值给option
        for(var i=1;i<optVal.length+1;i++)
        {
            __option[i]=$('<option>'+optVal[i-1]+'</option>');
        }
    }
    //将得到的option给ele
    for(var i=0;i<__option.length;i++)
    {
        ele.append(__option[i]);
    }
}

//解析json获取选中省的各个地区或市
function getCity(name){
    var __cityArr=new Array();
    $.ajax({
        type:'post',
        url:'./map/json/'+name+'.json',
        async: false,
        success:function(data){
            //通过for循环获得城市名称的数组
            for(var i=0;i<data.features.length;i++)
            {
                __cityArr[i]=data.features[i].properties.name;
            }
        }
        });
    return __cityArr;
}
//创建表格的头部
function createTblHead(tblEle){
    //先清理表格的头部
    tblEle.parent().prev('.tbl-head').remove();
    var __theadClone=tblEle.clone();	//克隆表格
    var __tblWidth=tblEle.width();
    var __div=$('<div class="tbl-head"></div>');
    __div.append(__theadClone);
    tblEle.parent().before(__div);
    var __tblHead=tblEle.parent().prev('.tbl-head');
    //定义表格头部容器的样式
    __tblHead.css({
        'position':'relative',
        'width':'100%',
        'height':'30px',
        'overflow':'hidden'
    });
    //定义表格的样式
    __tblHead.children('table').css({
        'position':'absolute',
        'width':__tblWidth+'px',
        'border-collapse':'collapse'
    });
    //定义th的样式
    __tblHead.children('table').find('th').css({
        'padding':'6px 0',
        'border':'1px solid #CCCCCC',
        'background':'url(image/table_th_bg.gif) repeat-x'
    });
    //定义td
    __tblHead.children('table').find('td').css({
        'padding':'6px 0',
        'border':'1px solid #CCCCCC'
    });
}

//创建右键菜单
function createMenu(menuVal,cla){
    //创建前清除右键内容
    $('#rightMenu').remove();
    //创建标签
    var __div=$('<div id="rightMenu"></div>');
    var __a=new Array();
    //根据menuVal的值生成a标签并添加到div中
    for(var i in menuVal)
    {
        __a[i]=$('<a href="javascript:;" class="'+cla[i]+'">'+menuVal[i]+'</a>');
        __div.append(__a[i]);
    }
    //将div添加到body中
    $('body').append(__div);
    //定义菜单的样式
    $('#rightMenu').css({
        'position':'absolute',
        'top':'200px',
        'left':'0',
        'border-top':'1px solid #25aacd',
        'border-left':'1px solid #25aacd',
        'border-right':'1px solid #25aacd',
        'z-index':'99999'
    });
    $('#rightMenu a').css({
        'display':'block',
        'padding':'4px 6px',
        'text-decoration':'none',
        'color':'#000000',
        'background-color':'#FFFFFF',
        'border-bottom':'1px solid #25aacd'
    });
}
//右键菜单内容鼠标事件
$('body').on('mouseover','#rightMenu a',function(){
   $(this).css({
       'background-color':'#25aacd',
       'color':'#fff'
   });
});
$('body').on('mouseout','#rightMenu a',function(){
    $(this).css({
        'background-color':'#fff',
        'color':'#000'
    });
});