wuhongyu
/
test


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
							<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link type="text/css" href="${contextPath}/WebPages_170421/css/keji/keji.css" rel="stylesheet">
    <link href="${contextPath}/WebPages_170421/css/bootstrap/bootstrap.min.css" rel="stylesheet">
    <script type="text/javascript" src="${contextPath}/WebPages_170421/${contextPath}/WebPages_170421/jquery.js"></script>
    <script src="${contextPath}/WebPages_170421/js/bootstrap.min.js"></script>
    <script src="${contextPath}/WebPages_170421/js/echarts.js"></script>

</head>
<body>

    <div class="head">
        <p class="tit">吉林省科技创新创业资源公共服务平台</p>
        <p class="tit1">科技数据展示</p>
        <p class="tit2"><a href="javascript:history.go(-1);">返回首页</a></p>
    </div>
    <div class="container">
        <div id="main">
            <script type="text/javascript">
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('main'));

                // 指定图表的配置项和数据
                var option = {
//                    textStyle: {
//                    color: 'red',
//                },
                    title : {
                        text: '合同登记数据展示',
                        top:50,
                        left:'center',
                        textStyle: {
                            color: '#fff',
                            fontSize:35
                        },
                        subtext: '来源：吉林省科技厅',
                        x:'center',
                        subtextStyle: {
                            color: '#fff',
//                            fontSize:20
                        }
                    },
                    tooltip : {
                        trigger: 'item',
                        formatter: "{a} <br/>{b} : {c} ({d}%)"
                    },
                    legend: {
                        orient: 'vertical',
                        left: 'right',
                        top:'200',
                        itemGap:25,
                        textStyle: {
                            color: '#fff'
                        },
//                        x : 'center',
//                        y : '650px',
                        data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
                    },
                    series : [
                        {
                            name: '访问来源',
                            type: 'pie',
                            radius : '55%',
                            center: ['50%', '60%'],
                            data:[
                                {value:335, name:'直接访问'},
                                {value:310, name:'邮件营销',color:'red'},
                                {value:234, name:'联盟广告'},
                                {value:135, name:'视频广告'},
                                {value:1548, name:'搜索引擎'}
                            ],
                            itemStyle: {
                                emphasis: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                                }

                            }

                        }
                    ],

                    color: [

                        '#c23531',
                        '#69bcf5',
                        '#61a0a8',
                        '#d48265',
                        '#91c7ae'
                    ]

                };


                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
            </script>

        </div>
    </div>
</body>
</html>