/********************************************
 *             前台展示 - 资源中心            *
 *******************************************/

//------------------------------------------
//F1.页面初始化
//F2.访问排行
//F3.最新资源
//F4.我的收藏夹
//F5.资源使用情况
//F6.初始化热门搜索关键字
//F7.热门搜索
//F8.搜索功能
//F9.我的申请资源
//F10.推荐资源
//F11.图表
//F12.我的申请详情
//F13 换一批（0定向推送1资源推荐）
//------------------------------------------

//F1.页面初始化
$(function () {
    $('.txt').css('width', $('.img').width() + 'px');
    var width1 = ($('.YWJC_Img').width() - $('.img').width()) / 2;
    $('.txt').css('left', width1 + 'px');
    $('.noanimate').css('width', $('.img').width() + 'px');

    var width1 = ($('.YWJC_Img').width() - $('.img').width()) / 2;
    $('.noanimate').css('left', width1 + 'px');

    //F2.访问排行
    FangWenPaiHang();

    //F3.最新资源
    ZuiXinZiYuan();

    //F4.我的收藏夹
    WoDeShouCangJia();

    //F5.我的足迹
    // WoDeZuJi();

    //F6.初始化热门搜索关键字
    initHotSearch();

    //F9.我的申请资源
    WoDeShenQing();

    //F10.我的推荐资源
    TuiJianZiYuan(0, 0);

    //F11.图表
    initEchaerts();

    //F14 资源推荐
    ZiYuanRecommend(0, 0);

    getChartData();

});

//F2.访问排行
function FangWenPaiHang() {
    $.ajax({
        url: '/res/resActionRecord/selectFangWenPaiHang',
        type: 'get',
        success: function (data) {
            var html = "";
            var jsonb = data.result;
            if (jsonb.length < 5) {
                $("#fwph").css("height", "275px");
            }
            var len = jsonb.length > 5?5:jsonb.length;
            for (var i = 0; i < len; i++) {
                var tit = htmlEncodeByRegExp(jsonb[i].fulltitle);
                var num = i+1;
                if (i == 0) {
                    html += "<li>" +
                        "<a title='" + tit + "' onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">" +
                        " <img src=\"/image/ZiYuanZhongXin/New/num1.png\" />&nbsp;&nbsp;" +
                        "<span>" + tit + "</span>" +
                        "</a>" +
                        "</li>";
                    continue;
                }
                if (i == 1) {
                    html += "<li>" +
                        "<a title='" + tit + "' onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">" +
                        "<img src=\"/image/ZiYuanZhongXin/New/num2.png\" />&nbsp;&nbsp;" +
                        "<span>" + jsonb[i].fulltitle + "</span>" +
                        "</a>" +
                        "</li>";
                    continue;
                }
                if (i == 2) {
                    html += "<li>" +
                        "<a title='" + tit + "' onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">" +
                        "<img src=\"/image/ZiYuanZhongXin/New/num3.png\" />&nbsp;&nbsp;" +
                        "<span>" + jsonb[i].fulltitle + "</span>" +
                        "</a>" +
                        "</li>";
                    continue;
                }
                else {
                    html += "<li>" +
                        "<a title='" + tit + "' onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">" +
                        "<span style='color: grey;display: inline-block;width: 41px;height: 17px;line-height: 17px;text-align: center;font-size: 16px;'>" + num + "</span>" +
                        "<span>&nbsp;&nbsp;" + jsonb[i].fulltitle + "</span>" +
                        "</a>" +
                        "</li>";
                }
            }

            $("#fwph").append(html);
        },
        error: function (e) {
          //  alert(e.message);
        }
    });
}

//F3.最新资源
function ZuiXinZiYuan() {
    $.ajax({
        url: '/res/ZiYuan/getAllOrderByTime',
        type: 'get',
        success: function (data) {
            var html = "";
            var jsonb = data.result;
            var today = new Date();
            var year = today.getFullYear() + "-";
            var month = today.getMonth() + 1;
            if (month < 10) {
                month = "0" + month;
            }
            var day = today.getDate();
            if (day < 10) {
                day = "0" + day;
            }
            var newday = year + month + "-" + day;
            if (jsonb.length < 5) {
                $("#zxzy").css("height", "275px");
            }
            var len = jsonb.length > 5?5:jsonb.length;
            for (var i = 0; i < len; i++) {
                var tit = htmlEncodeByRegExp(jsonb[i].fulltitle);
                html += "<li>" +
                    "<div>" +
                    "<a title='" + tit + "' onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">" + tit + "</a>" +
                    " <span style=\"color: #868686;float: right;\">" + jsonb[i].pubdate + "</span>" +
                    "</div>" +
                    "</li>";
            }
            $("#zxzy").append(html);
        },
        error: function (e) {
            //alert(e.message);
        }
    });
}

//F4.我的收藏夹
function WoDeShouCangJia() {
    $.ajax({
        // url: '/res/ditufuwu/getTopListWDSCJ',
        url: '/res/resActionRecord/selectByActiontype',
        type: 'post',
        dataType: 'json',
        data: {'actiontype': '收藏'},
        success: function (data) {
            var html = "";
            // var jsona = eval('(' + data + ')');
            var jsona = data.result;
            if (jsona.length < 5) {
                $(".mtree").css("height", "275px");
            }
            var len = jsona.length > 5?5:jsona.length;
            for (var i = 0; i < len; i++) {
                var tit = htmlEncodeByRegExp(jsona[i].fulltitle);
                html += "<li>" +
                    // "<a title=\"" + jsona[i].fulltitle + "\" style=\"vertical-align: middle;\" href=\"#\"></a>" +
                    "<a title=\"" + tit + "\" style=\"font-size: 13px;cursor: pointer;\" onclick=\"OpenZiYuan('" + jsona[i].resourceid + "')\" >" +
                    "<img style=\"padding-right: 5px; vertical-align: text-bottom;\" src=\"/image/ZiYuanZhongXin/New/shoucangicon.png\" />" + tit +
                    "</a>" +
                    " </li>";
            }
            $(".mtree").append(html);

        },
        error: function (e) {
            //alert(e.message);
        }
    });
}

//F5.我的足迹
function WoDeZuJi() {
    $.ajax({
        url: '/res/resActionRecord/selectByActiontype',
        type: 'post',
        dataType: 'json',
        data: {'actiontype': '浏览'},
        success: function (result) {
            var html = "";
            // var json = eval('(' + result + ')');
            var json = result.result;
            for (var i = 0; i < json.length; i++) {
                if (json.length - 1 != i) {
                    html += "<li>" +
                        "<a title=\"" + json[i].title + "\" style=\"vertical-align: middle;\" href=\"#\"></a>" +
                        "<a title=\"" + json[i].title + "\" style=\"color: rgb(250, 62, 69); cursor: pointer;\" onclick=\"OpenZiYuan('" + json[i].resourceid + "')\">" + json[i].title +
                        "</a>" +
                        "&nbsp;&nbsp;<span style=\"padding-right: 2px; font-size: 12px; float: right;\">" + json[i].finaltime + "</span>" +
                        "</li>";
                }
                if (json.length - 1 == i) {
                    html += "<li style='border-bottom: none !important;'>" +
                        "<a title=\"" + json[i].title + "\" style=\"vertical-align: middle;\" href=\"#\"></a>" +
                        "<a title=\"" + json[i].title + "\" style=\"color: rgb(250, 62, 69); cursor: pointer;\" onclick=\"OpenZiYuan('" + json[i].resourceid + "')\">" + json[i].title +
                        "</a>" +
                        "&nbsp;&nbsp;<span style=\"padding-right: 2px; font-size: 12px; float: right;\">" + json[i].finaltime + "</span>" +
                        "</li>";
                }
            }
            $(".zuji").append(html);
        },
        error: function (e) {
            //alert(e.message);
        }
    });
}

//F6.初始化热门搜索关键字
function initHotSearch() {
    $.ajax({
        url: '/res/getTopHotSearch',
        type: 'get',
        success: function (data) {
            if (data != "") {
                var list = data.result;
                var html = "<li>热门搜索：</li>";

                var num = 0;
                for (var i = 0; i < list.length; i++) {
                    // num += list[i].keyword.replace(/[^\x00-\xff]/g, 'xx').length;
                    // num += list[i].keyword.length;
                    // if(num > 50) break;
                    html += "<li onclick='HotSearch(this)' title='" + list[i].keyword + "' >" + list[i].keyword + "</li>";
                }
                // $("#ReMenSouSuoBox").css("width",window.innerWidth);
                $("#ReMenSouSuoBox ul").append(html);
            }
        },
        error: function (e) {
            //alert(e.message);
        }
    });
}

//F7.热门搜索
function HotSearch(e) {
    var keyword = $(e).attr("title");
    window.open("/res/ziyuanmulu/index?Menu=ZYZX&menuId=08&Message=" + encodeURIComponent(keyword), "_black");
}

//F8.搜索功能
function Search() {
    var key = document.getElementById("guanjianziSeach").value;
    // if (key != "") {
        $.ajax({
            url: 'Search',//TuiJianZiYuan
            type: 'post',
            data: {"key": key},
            success: function (data) {
            }
        });
        window.open("/res/ziyuanmulu/index?Menu=ZYZX&menuId=08&Message=" + encodeURIComponent(key), "_black");
    // }
}

//F9.我的申请资源
function WoDeShenQing() {
    $.ajax({
        url: '/res/resApplyRecommend/shenQingZiYuan',
        type: 'get',
        success: function (sqzy) {
            var html = "";
            var jsonzy = sqzy.result;
            if (jsonzy.length < 7) {
                $("#sqzy").css("height", "371px");
            }
            var len = jsonzy.length > 7?7:jsonzy.length;
            for (var i = 0; i < len; i++) {
                if (jsonzy.length == 0) {
                    break;
                }
                // if (9 != i) {
                var tit = htmlEncodeByRegExp(jsonzy[i].fulltitle);
                html += "<div class=\"sqzy\">";
                if (jsonzy[i].auditresult == "0") {
                    html += "<a title='" + tit + "' style=\"color: black; cursor: pointer;transition: 0.3s;\" onclick=\"OpenZiYuan('" + jsonzy[i].resourceid + "')\">" +
                        "<img class='fimg' src=\"/image/ZiYuanZhongXin/New/wodeshenqing_icon.png\" />" + tit + " </a>" +
                        " <img onclick='showApplyInfo(" + jsonzy[i].appid + ")' class='limg' src=\"/image/ZiYuanZhongXin/New/weipifu.png\" />";
                } else if (jsonzy[i].auditresult == "1") {
                    html += "<a title='" + tit + "' style=\"color: black; cursor: pointer;transition: 0.3s;\" onclick=\"OpenZiYuan('" + jsonzy[i].resourceid + "')\">" +
                        "<img class='fimg' src=\"/image/ZiYuanZhongXin/New/wodeshenqing_icon.png\" />" + tit + " </a>" +
                        " <img class='limg' onclick='showApplyInfo(" + jsonzy[i].appid + ")' src=\"/image/ZiYuanZhongXin/New/yitongguo.png\" />";
                } else if (jsonzy[i].auditresult == "2") {
                    html += "<a title='" + tit + "' style=\"color: black; cursor: pointer;transition: 0.3s;\" onclick=\"OpenZiYuan('" + jsonzy[i].resourceid + "')\">" +
                        "<img class='fimg' src=\"/image/ZiYuanZhongXin/New/wodeshenqing_icon.png\" />" + tit + " </a>" +
                        " <img class='limg' onclick='showApplyInfo(" + jsonzy[i].appid + ")' src=\"/image/ZiYuanZhongXin/New/weitongguo.png\" />";
                } else if (jsonzy[i].auditresult == "null" || jsonzy[i].auditresult == null) {
                    html += "<a title='" + tit + "' style=\"color: black; cursor: pointer;\" onclick=\"OpenZiYuan('" + jsonzy[i].resourceid + "')\">" +
                        "<img class='fimg' src=\"/image/ZiYuanZhongXin/New/wodeshenqing_icon.png\" />" + tit + " </a>" +
                        " <img class='limg' onclick='showApplyInfo(+jsonzy[i].appid+)' src=\"/image/ZiYuanZhongXin/New/weipifu.png\" />";
                }
                html += "</div>";
            }
            $("#sqzy").append(html);
        },
        error: function (e) {
           // alert(e.message);
        }
    });
}

//F10.我的推荐资源(0默认1换一批,)
function TuiJianZiYuan(type, num) {
    var url = (type == 0 ? '/res/ZiYuan/getTopRecommend?isDiTuFuwu=false' : ('/res/ditufuwu/getTuiJianZiYuanByIndex?isDiTuFuwu=false&limit=5&page=' + num));
    $.ajax({
        url: url,
        type: 'get',
        success: function (data) {
            var html = "";
            // var r = decodeURIComponent(data);
            var jsonb = data.result;
            // if (jsonb.length < 3) {
            //     $("#divtuijianziyuan").css("height", "398.5px");
            // }
            for (var i = 0; i < (jsonb.length > 5 ? 5 : jsonb.length); i++) {
                var description = decodeURIComponent(jsonb[i].description);
                var fulldescription = decodeURIComponent(jsonb[i].fulldescription);
                html += "<li class=\"YWJC_Img\" style=\"margin: 10.5px 0px 10.5px 0px !important;\" onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">"
                    + "<div style=\"margin: 0px auto; text-align: center;\">";
                html += "<img class=\"img\" src=\"" + jsonb[i].imgurl + "\" />";
                html += "<div class=\"txt\" style=\"float:left;margin-left: 2px;width: 96%; height: 25px; overflow: hidden; cursor: pointer;\">"
                    + "<h3 style=\"padding-top: 0px;\">" + jsonb[i].title + "</h3>"
                    + "<p title='" + fulldescription + "' style=\"text-align: left; padding-right: 10px; padding-left: 10px;\">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" + description + "</p>"
                    + "</div>"
                    + "</div>"
                    + "</li>";
            }

            $("#tjzy").html(html);

            $(".lanren ul li").hover(function () {
                $(this).find(".txt").stop().animate({height: "100px"}, 400);
                $(this).find(".txt h3").stop().animate({marginTop: "10px"}, 400);
            }, function () {
                $(this).find(".txt").stop().animate({height: "25px"}, 400);
                $(this).find(".txt h3").stop().animate({marginTop: "0"}, 400);
            });
        },
        error: function (e) {
           // alert(e.message);
        }
    });
}

//F11.图表
function initEchaerts() {
    var divzylx = document.getElementById("zylx");
    var divzyly = document.getElementById("zyly");
    var divzyml = document.getElementById("zyml");
    var divshzt = document.getElementById("shzt");
    var divgxxy = document.getElementById("gxxy");

    var zylx = echarts.init(divzylx);
    var zyly = echarts.init(divzyly);
    var zyml = echarts.init(divzyml);
    var shzt = echarts.init(divshzt);
    var gxxy = echarts.init(divgxxy);

    var zylxoption = {
        title: {
            text: '资源类型统计',
            x: 'left',
            textStyle:{
                color:'#4777FF',
                fontSize:20,
                fontWeight:600
            }
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        color: ['#00afff', '#ff5654', '#fec100', '#9fff92', '#56dc2b'],
        series: [
            {
                name: '资源类型',
                type: 'pie',
                center:['50%','60%'],
                radius : ['50%', '40%'],
                itemStyle : {
                    normal : {
                        label : {
                            show : true,
                            textStyle:{
                                // color:'#bfbfbf',
                                fontSize:14
                            }
                        }
                    }
                },
                data: resourceclassSeries
            }
        ]
    };
    zylx.setOption(zylxoption);
    var zylyoption = {
        title: {
            show:false,
            text: '资源来源排行',
            x: 'left',
            textStyle:{
                color:'#4777FF',
                fontSize:20,
                fontWeight:600
            }
        },
        grid:{
            y:30,
            x:100,
            width:'65%',
            height:'77%',
        },
        color:['#008aff'],
        tooltip: {
            trigger: 'axis'
        },
        xAxis: [
            {
                type: 'value',
                splitLine: {
                    show: true
                },
                axisLabel:{
                    textStyle: {
                        fontSize: 14,
                        color:'#bfbfbf'
                    },
                },
                axisLine: {
                    lineStyle: {
                        color: '#bfbfbf'
                    }
                },
            }
        ],
        yAxis : [
            {
                type : 'category',
                data : DataSourceLegends,
                splitLine: {
                    show: false
                },
                axisLabel:{
                    textStyle: {
                        fontSize: 14,
                        color:'#bfbfbf'
                    },
                },
                axisLine: {
                    lineStyle: {
                        color: '#bfbfbf'
                    }
                },
            }
        ],
        series: [
            {
                name: '资源数量',
                type: 'bar',
                barWidth:18,
                data: DataSourceSeries,
            }
        ]
    };
    zyly.setOption(zylyoption);
    var zymloption = {
        tooltip: {
            trigger: 'axis'
        },
        grid: {
            y:30,
            x:70,
            x2:40,
            borderWidth: 0,
            height:'77%',
        },
        calculable: false,
        xAxis: [
            {
                type: 'category',
                // axisLabel: {
                //     interval: 0,
                //     rotate: 40
                // },
                axisLine: {
                    lineStyle: {
                        color: '#bfbfbf'
                    }
                },
                boundaryGap: false,
                data: MuLuLegends,
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: 'rgba(205,223,255,0.9)' //分隔线的颜色
                    }
                },
                axisLabel:{
                    textStyle: {
                        fontSize: 14,
                        color:'#bfbfbf'
                    },
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                axisLabel: {
                    formatter: '{value}'
                },
                axisLine: {
                    lineStyle: {
                        color: '#bfbfbf'
                    }
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: 'rgba(205,223,255,0.9)' //分隔线的颜色
                    }
                },
                axisLabel:{
                    textStyle: {
                        fontSize: 14,
                        color:'#bfbfbf'
                    },
                }
            }
        ],
        series: [
            {
                name: '资源数量',
                type: 'line',
                data: MuLuSeries,
                symbol:'circle',
                symbolSize: 4,   //拐点大小
                smooth: true,    //线条光滑
                itemStyle: {
                    normal: {
                        lineStyle: {
                            color: '#0079ff',
                            width:2
                        },
                        label: {
                            show: true,
                            textStyle: {
                                fontSize: 14,
                                color: '#000000'
                            },
                        },
                        color: '#FFFFFF',        //legend的颜色，也是拐点圆圈的填充颜色
                        borderColor: '#0079ff',  //拐点圆圈边框的颜色
                        borderWidth:2            //拐点圆圈边框的宽度
                    }
                },
            },
        ]
    };
    zyml.setOption(zymloption);

    var gxxyoption = {
        title: {
            text: '共享协议',
            x: 'left',
            textStyle:{
                color:'#4777FF',
                fontSize:20,
                fontWeight:600
            }
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        color: ['#00afff', '#ff5654', '#fec100', '#9fff92', '#56dc2b'],
        series: [
            {
                name: '共享协议',
                type: 'pie',
                center:['50%','60%'],
                radius : ['50%', '40%'],
                itemStyle : {
                    normal : {
                        label : {
                            show : true,
                            textStyle:{
                                fontSize:14
                            }
                        }
                    }
                },
                data: sharprotocolSeries[0].seriesData
            }
        ]
    };
    gxxy.setOption(gxxyoption);
   $('#zylyHide').hide()
}

//F12.我的申请详情
function showApplyInfo(appid) {
    var url = "/res/resApplyRecommend/applyRecommendInfo?appid=" + appid;
    // winPro.openFullwin(url, "查看资源申请", "yes");
    openFullWindow(url, "查看资源申请");
}

//F13 换一批（0定向推送1资源推荐）
var indexp = 2;
var indexr = 2;

function ChangeNext(type) {
    var totalIndex = 0;
    if (type == 0) {
        totalIndex = (totalpNum % 3) > 0 ? (totalpNum / 3) + 1 : (totalpNum / 3);
        if (indexp > totalIndex) {
            indexp = 1;
        }
        TuiJianZiYuan(1, indexp);
        indexp++;
    } else {
        totalIndex = (totalrNum % 3) > 0 ? (totalrNum / 3) + 1 : (totalrNum / 3);
        if (indexr > totalIndex) {
            indexr = 1;
        }
        ZiYuanRecommend(1, indexr);
        indexr++;
    }

}

//F14 资源推荐
function ZiYuanRecommend(type, num) {
    var url = (type == 0 ? '/res/ditufuwu/getMainInfoRecommends?isDiTuFuwu=false&limit=6&page=1' : ('/res/ditufuwu/getMainInfoRecommends?isDiTuFuwu=false&limit=6&page=' + num));
    $.ajax({
        url: url,
        type: 'get',
        success: function (data) {
            var html = "";
            var jsonb = data.result;
            for (var i = 0; i < (jsonb.length > 6 ? 6 : jsonb.length); i++) {
                var description = decodeURIComponent(jsonb[i].description);
                var fulldescription = decodeURIComponent(jsonb[i].fulldescription);
                var tit = htmlEncodeByRegExp(jsonb[i].title);

                html += "<li>";
                html += "<a title='" + tit + "' style=\"color: black;\" onclick=\"OpenZiYuan('" + jsonb[i].resourceid + "')\">"
                html += getTypeName(jsonb[i].resourceclass);
                html += tit+"</a>";
                html += "</li>";
            }
            $("#rrzy").html(html);
        },
        error: function (e) {
         //   alert(e.message);
        }
    });
}

function getTypeName(name) {
    var typeName = "";
    var html = "";
    if(name == "JKFW") {
        typeName = "接口";
        html = "<span class='label label-danger'>接口</span>";
    }
    if(name == "SJWJ") {
        typeName = "数据";
        html = "<span class='label label-default'>文件</span>"
    }
    if(name == "SJKB") {
        typeName = "库表";
        html = "<span class='label label-primary'>库表</span>"
    }
    if(name == "YWJC") {
        typeName = "集成";
        html = "<span class='label label-info'>集成</span>"
    }
    if(name == "KJ_JCDT") {
        typeName = "地图";
        html = "<span class='label label-success'>底图</span>"
    }
    if(name == "KJ_ZTDT") {
        typeName = "专题";
        html = "<span class='label label-pink'>专题</span>"
    }
    if(name == "KJ_KJFX") {
        typeName = "空间";
        html = "<span class='label label-warning'>空间</span>"
    }
    if(name == "KJ_SWFW") {
        typeName = "三维";
        html = "<span class='label label-primary'>三维</span>"
    }
    if(name == "KJ_YWTC") {
        typeName = "业务";
        html = "<span class='label label-danger'>业务</span>"
    }

    return html;
}


//获取统计图数据 -- 公共方法（异步调用）
function getChartData() {
    var chartData = null;
    $.ajax({
        url: '/res/ziyuanmulu/getChart?flag=sjtj',
        data: '',
        type: 'get',
        success: function(data) {
            chartData = eval('(' + data + ')');
            createShiJianTongJiChart(chartData);
        },
        error: function(e) {
           // alert(e.message);
        }
    });
}

//时间统计统计图
function createShiJianTongJiChart(chartData) {
    var Time = document.getElementById("div_Time");
    var TimeChart = echarts.init(Time);
    var strSeries = "";
    var key = "";
    for (var i = 0; i < chartData.Legend.length; i++) {
        var name = chartData.Legend[i].name;
        var key = chartData.Legend[i].key;
        if (strSeries != "") {
            strSeries += ",";
        }
        strSeries += "{name: '" + name + "',type: 'line',smooth: true,data: [" + eval("chartData.Series." + key) + "],markPoint: {data: [{type: 'max', name: '最大值'}],itemStyle:{normal:{label:{textStyle:{fontWeight:600}}}}}}";
    }
    var Series = eval("([" + strSeries + "])")

    //构造 Option
    var option = {
        tooltip: {
            trigger: 'axis'
        },
        color: [
            '#FFC200', '#FF3A3A', '#E52F70', '#982CD5', '#5768F0', '#0066FF', '#25AE6A', '#1E7532', '#FFF000',
            '#CA6821', '#D04311', '#BBA767'
        ],
        legend: {
            top: 10,
            right: 50,
            textStyle: {
                fontSize: 14
            },
            data: chartData.Legend
        },
        calculable: true,
        grid: {
            // top: 80,
            right: 60,
            // bottom: 50,
            left: 60,
            height:'64%'
        },
        xAxis: [
            {
                type: 'category',
                boundaryGap: false,
                data: chartData.xAxis,
                axisLabel:{
                    textStyle: {
                        fontSize: 14,
                        color:'#bfbfbf'
                    },
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                axisLine: {
                    color: '#78B9EF',
                    opacity: 0.5,
                },
                axisLabel:{
                    textStyle: {
                        fontSize: 14,
                        color:'#bfbfbf'
                    },
                }
            }
        ],
        series: Series
    };

    TimeChart.setOption(option);
}