var resultData = null;
var ChartName = "";
window.onload = function () {
    GetData();
    btnClick();
    new CusScrollBar({
        contentSelector: '.scroll_cont1', //滚动内容区
        barSelector: '.scroll_bar1', //滚动条
        sliderSelector: '.scroll_slider1' //滚动滑块
    });
    ChartName = decodeURI(getUrlParam("typeName"));
    $(".ttitle").empty();
    $(".ttitle").append(ChartName);
}

//数据特殊，单独开发
function GetData() {
    var TableName = getUrlParam("tableType");
    var TableColor = GetCmpareTable(TableName);
    var dataLegend = [];
    var dataY1 = [];
    var dataY2 = [];
    var Pnode = "";
    var html = "";
    $.ajax({
        url: "../../../Ashx/DataQH.ashx",
        type: "post",
        data: { Action: "GetQHFZData", dataTable: TableName, colorTable: TableColor },
        dataType: "json",
        async: false,
        success: function (result) {
            resultData = result;
            $.each(result, function (index, value) {
                html += "<tr style='background-color:rgb(" + value.R + "," + value.G + "," + value.B + ");'><td>" + value.Name + "</td><td>" + parseFloat(value.Area).toFixed(2) + "</td><td>" + parseFloat(value.ZhouChang).toFixed(2) + "</td></tr>";
                //创建数据
                var itemStyle = new obj();
                var itemColor = new col();
                var clkVal = new clk();
                if (value.Type == "parent") {
                    dataLegend.push(value.Name);                   
                    itemStyle.value = value.Area;
                    itemStyle.name = value.Name;
                    
                    itemColor.color = "rgb(" + value.R + "," + value.G + "," + value.B + ")";
                    itemStyle.itemStyle = itemColor;
                    if (index == 0) {
                       // itemStyle.label = clkVal;
                       // itemStyle.selected = true;
                        Pnode = value.fr;
                    }
                    dataY2.push(itemStyle);
                } else {
                    if (Pnode == value.fr.substring(0, Pnode.length) | Pnode == value.fr) {
                        itemStyle.value = value.Area;
                        itemStyle.name = value.Name;
                        //itemStyle.label = clkVal;
                        itemColor.color = "rgb(" + value.R + "," + value.G + "," + value.B + ")";
                        itemStyle.itemStyle = itemColor;
                        dataY1.push(itemStyle);
                    }
                }
            });
            InitChart( dataLegend, dataY1, dataY2);
            $("#dataTable table").empty();
            $("#dataTable table").append("<tr><td>名称</td><td>面积</td><td>周长</td></tr>"+html);
        }
    });
}

function InitChart( dataLegend, dataY1, dataY2) {
    dataY1 = uniq(dataY1);
    var dom = document.getElementById("container");
    var myChart = echarts.init(dom);
    option = null;
    option = {
        //title: {
        //    text: ChartName,
        //    x: 'center',
        //    y: 'top',

        //    textStyle: {
        //        color: '#ffffff'
        //    }
        //},
        tooltip: {
            trigger: 'item',
            confine: 'hidden',
            formatter: '{a} <br/>{b}: {c} ({d}%)'
        },
        legend: {
            orient: 'horizontal',
            bottom: '10',
            textStyle: {
                color: '#ffffff'
            },
            icon: "circle",
            itemWidth: 15,
            itemHeight: 15,
            data: dataLegend
        },
        
        series: [
            {
                center: ["50%", "30%"],
                name: '面积',
                type: 'pie',
               
                radius: [0, '20%'],
                label: {
                    show: false,
                    position: 'center'
                },

                labelLine: {
                    show: false
                },
                data: dataY1

            },
            {
                center: ["50%", "30%"],
                name: '面积',
                type: 'pie',
                radius: ['30%', '50%'],
                label: {
                    show: false,
                    position: 'center'
                },

                labelLine: {
                    show: false
                },
                data: dataY2
            }
        ]
    };;
    if (option && typeof option === "object") {

        myChart.setOption(option, true);
    };

    myChart.on('click', function (params) {
        // 当componentType == "xAxis"或者 ==“yAxisx”时，取被点击时坐标轴的值params.value
        if (params.seriesIndex == 1 & dataY1 != "") {
            myChart.dispose();
           // alert(params.name);
            GetClickData(params.name);
        }

    });
}


var obj = function (val, Nam) {
    return {
        value: val,
        name: Nam,
        itemStyle: col
        //label: clk
    }

}


var col = function (colorRgb) {
    return {
        color: colorRgb
    }
}
//点中的显示
var clk = function () {
    return {
        show: 'true'

    }
}



//点击模块
function GetClickData(Name) {
    var dataLegend = [];
    var dataY1 = [];
    var dataY2 = [];
    var code = "";
    if (resultData != null) {
        $.each(resultData, function (index, Rsvalue) {
            //var R = Rsvalue.R;
            //var G = Rsvalue.G;
            //var B = Rsvalue.B;           
            var itemStyle = new obj();
            var itemColor = new col();
            var clkVal = new clk();
            
            if (Rsvalue.Type == "parent") {
                itemStyle.value = Rsvalue.Area;
                itemStyle.name = Rsvalue.Name;
                
                itemColor.color = "rgb(" + Rsvalue.R + "," + Rsvalue.G + "," + Rsvalue.B + ")";
                itemStyle.itemStyle = itemColor;
                dataLegend.push(Rsvalue.Name);                
                if (Rsvalue.Name == Name) {
                    itemStyle.label = clkVal;
                    itemStyle.selected = true;
                    code = Rsvalue.fr;
                    
                }
                dataY2.push(itemStyle);
            } else {
                if (((code == (Rsvalue.fr.substring(0, code.length))) | (code == Rsvalue.fr))&code!="") {
                    itemStyle.value = Rsvalue.Area;
                    itemStyle.name = Rsvalue.Name;
                    itemStyle.label = clkVal;
                    itemColor.color = "rgb(" + Rsvalue.R + "," + Rsvalue.G + "," + Rsvalue.B + ")";
                    itemStyle.itemStyle = itemColor;
                    dataY1.push(itemStyle);
                }
            }
        })
        InitChart( dataLegend, dataY1, dataY2);
    }

}

function uniq(array) {
    var temp = []; //一个新的临时数组
    for (var i = 0; i < array.length; i++) {
        if (temp.indexOf(array[i]) == -1) {
            temp.push(array[i]);
        }
    }
    return temp;
}


function btnClick() {
    $(".chartBtn").click(function () {
        $("#container").css("display", "block");
        $("#dataTable").css("display", "none");
        $(".dataBtn").css("color", "#ffffff");
        $(".chartBtn").css("color", "aqua");
    });

    $(".dataBtn").click(function () {
        $("#container").css("display", "none");
        $("#dataTable").css("display", "block");
        $(".dataBtn").css("color", "aqua");
        $(".chartBtn").css("color", "#ffffff");
    });
}