var mapMonitor,picHeight;
$(function(){
    picHeight=($(window).height()-10);
    $("#mapMonitor").css("height",picHeight);
    $("#areaCounts").css("height",picHeight*0.5);
    $("#volCounts").css("height",picHeight*0.5);

    //初始化图表以及表格数据
    var endTime = getEndTime();
    var startTime = getMonthStartTime(endTime);
    //初始化获取区域地图数据
    var i ;
    $.ajax({
        type : "POST",
        url : "/pqs9200/area/getMapData",
        dataType : "text",
        data : {
            startTime : startTime,
            endTime : endTime
        },
        beforeSend: function () {
            i = ityzl_SHOW_LOAD_LAYER();
        },
        success : function(data) {
            var info = $.parseJSON(data);
            if (info.code === 500) {
                //统计区域的监测点
                initEvents(null);
                initTable(null);
                initArea(null);
                initVoltage(null);
            } else {
                //统计区域的监测点
                initEvents(info.body.areaList);
                initTable(info.body.areaList);
                initArea(info.body.areaList);
                initVoltage(info.body.vol);
            }
            //***********关闭loading
            ityzl_CLOSE_LOAD_LAYER(i);
        }
    });
})

/**
 * 电压等级饼图绘制
 */
function initVoltage(vol) {
    echarts.dispose(document.getElementById('volCounts'));
    var volCounts = echarts.init(document.getElementById('volCounts'));
    var legendArray=[];
    var valueArray=[];
    if(vol!=null && vol.length>0){
        for(var i=0;i<vol.length;i++){
            legendArray.push(vol[i].voltageValue);
            var volValue={};
            volValue.name=vol[i].voltageValue;
            if(Number(vol[i].times)===3.1415||Number(vol[i].times)===3.14159){
                volValue.value=0;
            }else{
                volValue.value=Number(vol[i].times);
            }
            valueArray.push(volValue);
        }
    }
    var option = {
        title : {
            text: '电压等级统计',
            x:'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            data: legendArray,
            show:false
        },
        series : [
            {
                name: '电压等级',
                type: 'pie',
                radius : '55%',
                center: ['50%', '60%'],
                label: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: true
                    }
                },
                lableLine: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: true
                    }
                },
                data:valueArray,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    volCounts.setOption(option);
}

/**
 * 区域饼图绘制
 */
function initArea(areaList) {
    echarts.dispose(document.getElementById('areaCounts'));
    var areaCounts = echarts.init(document.getElementById('areaCounts'));
    var legendArray=[];
    var valueArray=[];
    if(areaList!=null){
        for(var i=0;i<areaList.length;i++){
            legendArray.push(areaList[i].name);
            var cityValue={};
            cityValue.name=areaList[i].name;
            if(Number(areaList[i].value)===3.1415||Number(areaList[i].value)===3.14159){
                cityValue.value=0;
            }else{
                cityValue.value=Number(areaList[i].value);
            }
            valueArray.push(cityValue);
        }
    }
    var option = {
        title : {
            text: '区域严重度',
            x:'center'
        },
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            data: legendArray,
            show:false
        },
        series : [
            {
                name: '区域名',
                type: 'pie',
                radius : '55%',
                center: ['50%', '60%'],
                label: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: true
                    }
                },
                lableLine: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: true
                    }
                },
                data:valueArray,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    areaCounts.setOption(option);
}

/**
 * 表格数据填充
 */
function initTable(areaList){
    var height=picHeight*0.5-45;
    if(areaList==null){
        areaList=[];
    }
    $("#areaTable").DataTable({
        data: areaList,
        autoWidth:false,
        order:[1,"desc"],
        columnDefs : [
            { "width": "33%", "targets": 0 },
            { "width": "33%", "targets": 1 },
            { "width": "33%", "targets": 2 }
        ],
        paging:false,
        lengthChange: false,
        searching:false,
        destroy : true,
        scrollY: height,
        info:false,
        pageLength:100,
        language : {
            url:'/pqs9200/json/chine.json',
        },
        columns: [
            { data: 'name' },
            { data: 'value',render:function (data, type, full, meta) {
                    if(Number(data)===3.1415){
                        return "/";
                    }else if(Number(data)===3.14159){
                        return "（暂无数据）";
                    }else{
                        return data;
                    }
                }},
            {data:'node'}
        ],
    })
}

/**
 * 区域地图绘制
 */
function initEvents(eventData){
    //地图容器
    mapMonitor = echarts.init(document.getElementById('mapMonitor'));
    if(eventData==null){
        //获取地图数据
        var geoJson=getFullMapData();
        d = [];
        var max=100;
        //注册地图
        echarts.registerMap('严重度分析', geoJson);
        //绘制地图
        renderMap(d,max);
    }else{
        if(eventData.length>1){
            //获取地图数据
            var geoJson=getFullMapData();
            d = [];
            var max=0;
            for( var i=0;i<eventData.length;i++ ){
                var name=eventData[i].name;
                var value=Number(eventData[i].value);
                if(value===3.1415||value===3.14159){
                    value=0;
                }
                if (value > max) {
                    max = value;
                }
                d.push({
                    name : name,
                    value : value
                })
            }
            max = Math.ceil(Number(max)*1.2);
            //注册地图
            echarts.registerMap('严重度分析', geoJson);
            //绘制地图
            renderMap(d,max);
        }else{
            var d = [];
            var name=eventData[0].name;
            var value=Number(eventData[0].value);
            if(value===3.1415||value===3.14159){
                value=0;
            }
            var max = Math.ceil(value*1.2);
            // 获取地图数据
            var data = getSingelMapData(name);
            if(data!==null){
                d.push({
                    name : name,
                    value : value
                });
                // 注册地图
                echarts.registerMap('严重度分析', data);
                // 绘制地图
                renderMap(d, max);
            }
        }
    }
}
//初始化绘制全国地图配置
var  option = {
    backgroundColor: '#fff',
    title : {
        text: '区域严重度分析',
        left: 'center'
    },
    tooltip: {
        trigger: 'item',
        formatter:function(params){
            var color;
            if(isNaN(params.value)||params.value===0){
                color='#f9f9f9';
            }else{
                color=params.color;
            }
            var tips="";
            tips +='<font style=\'color:'+color+'\'>'+params.name+'</font><br/>';
            if(isNaN(params.value)){
                tips +='<font style=\'color:'+color+'\'>暂降事件数：0个</font><br/>';
            }else{
                tips +='<font style=\'color:'+color+'\'>暂降事件数：'+params.value+'个</font><br/>';
            }
            return tips;
        }
    },
    animationDuration:1000,
    animationEasing:'cubicOut',
    animationDurationUpdate:1000
};

function renderMap(data,max){
    option.dataRange={
        min: 0,
        max: max,
        color:['darkorange','#ccc'],
        text:['高','低'], // 文本，默认为数值文本
        calculable : true
    };
    option.series = [
        {
            type: 'map',
            mapType: '严重度分析',
            roam: true,
            label: {
                normal:{
                    show:true,
                    textStyle:{
                        color:'black',
                        fontSize:10
                    }
                },
                emphasis: {
                    show: true,
                    textStyle:{
                        color:'black',
                        fontSize:10
                    }
                }
            },
            itemStyle: {
                normal: {
                    areaColor: '#CCCCCC',
                    borderColor: 'dodgerblue'
                },
                emphasis: {
                    areaColor: 'darkorange'
                }
            },
            data:data
        }
    ];
    //渲染地图
    mapMonitor.setOption(option);
}
