<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        #bar{
            width: 470px;
            height: 210px;
        }
    </style>
</head>
<body>

<div class="box">
    <div id="bar"></div>

</div>


<script src="/css/_files/js/jquery.js"></script>
<script src="/css/_files/js/echarts.min.js"></script>
<script src="/css/_files/js/macarons.js"></script>

<script type="text/javascript" th:inline="javascript">

    echarts2();
    function echarts2() {

        var dataArray = [];
        var pieNum = [[${pieNum}]];
        var zdxqzh=0;
        $.each(pieNum, function (k, v) {
            var item=new Object();
            if(k=="项目投资(自贸区)")
            {
                item.name="自贸区项目投资";
                item.value=v;
            }
            else if(k=="项目投资")
            {
                item.name="正定县项目投资";
                item.value=v;
            }
            else if(k=="建设局(正定新区)" || k=="经发局(正定新区)")
            {
                zdxqzh+=v;
            }
            else if(k!="市场主体" && k!="市场主体(自贸区)"){

                if(k=="代办公司")
                {
                    item.name="代办服务";
                    item.value=v;
                }
                else
                {
                    item.name=k
                    item.value=v;
                }
            }
            dataArray.push(item);
        });

        var item=new Object();
        item.name="正定新区";
        item.value=zdxqzh;
        dataArray.push(item);

        var myChart = echarts.init(document.querySelector("#bar"),"macarons");

        var option = {
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c} ({d}%)'
            },
            series: [
                {
                    name: '数据源',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '60%'],
                    data:dataArray,
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
};





        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });

    }

</script>

</body>
</html>