var code = "";
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")); //localStorage.getItem("typeName");
    $(".ttitle").empty();
    $(".ttitle").append(ChartName);
}

function GetData() {
    var dataLegend = [];
    var dataY1 = [];
    var dataY2 = [];
    var TableName = getUrlParam("tableType"); //localStorage.getItem("type");
    var TableColor = GetCmpareTable(TableName);
    $.ajax({
        url: "../../../Ashx/DataQH.ashx",
        type: "post",
        data: { Action: "GetAllQHData", dataTable: TableName, colorTable: TableColor },
        dataType: "json",
        async: false,
        success: function (result) {
            //alert(JSON.stringify(result));
            var dataLegend = [];
            var dataArea = [];
            var color = [];
            var html = "";
            $.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>";
                color.push("rgb("+value.R+","+value.G+","+value.B+")");
                dataLegend.push(value.Name);
                var item = new ItemStyle();
                item.name = value.Name;
                item.value =parseFloat(value.Area).toFixed(2);
                dataArea.push(item);
               
            });
            
            InitChart(color, dataLegend, dataArea);
            $(".scroll_cont1 table").empty();
            $(".scroll_cont1 table").append("<tr><td>名称</td><td>面积</td><td>周长</td></tr>" + html);           
        }
    });
}

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

        //    textStyle: {
        //        color: '#ffffff',
        //        fontSize: 15
        //    }
        //},
        color:color,
        tooltip: {
            trigger: 'item',
            confine:'hidden',
            formatter: '{b} : {c} ({d}%)'
        },
        legend: {
            orient: 'horizontal',
            bottom: '10',
            textStyle: {
                color: '#ffffff'
            },
            icon: "circle",
            itemWidth: 15,
            itemHeight: 15,
            data: dataX
        },
        series: [
            {
                name: '',
                type: 'pie',
                radius: '45%',
                center: ['50%', '30%'],
                label: {
                    show: false,
                    position: 'center'
                },
                
                labelLine: {
                    show: false
                },
                data: dataY
            }
        ]
    };
    if (option && typeof option === "object") {
        myChart.setOption(option, true);
    };
}

var  ItemStyle=function(value,name){
    return {
        value: value,
        name:name
    }
}
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("background-color", "#000000");
        $(".chartBtn").css("background-color", "#033D73");
    });

    $(".dataBtn").click(function () {
        $("#container").css("display", "none");
        $("#dataTable").css("display", "block");
        $(".dataBtn").css("background-color", "#033D73");
        $(".chartBtn").css("background-color", "#000000");
    });
}