123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438 |
- <!DOCTYPE html>
- <html lang=zh-cn>
- <head>
- <meta charset=utf-8>
- <title>网络版后台管理</title>
- <meta name=description content=>
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="renderer" content="webkit">
- <link rel=stylesheet href=css/bootstrap.css>
- <link rel=stylesheet href=css/style.css>
- <link rel=stylesheet href=css/dateRange.css>
- <script src=js/jquery-1.9.1.min.js></script>
- <script src=js/bootstrap.js></script>
- <script src=js/global.js></script>
- <script src=js/echarts.js></script>
- <script type=js/macarons.js></script>
- <script src=js/dateRange.js></script>
- <script src=js/jquery.tablesorter.js></script>
- </head>
- <body>
- <div class="headerWrapper"></div>
- <div class="wrapper">
- <div class="leftWrapper">
- <div class="leftContent">
- <div class="logo logoWl">
- <h2>网<span class="logoInfo">络版后台</span><!-- <span class="caret"></span> --></h2>
- <!-- <div class="logoList">
- <ul>
- <li><a href="#">文库</a></li>
- <li><a href="#">问答</a></li>
- <li><a href="#">价格信息</a></li>
- <li><a href="#">官网</a></li>
- <li><a href="#">通行帐号</a></li>
- </ul>
- </div> -->
- </div>
- <div class="subMenu">
- <h2 class="subMenuTitle"><a><i class="iconImg icon-">B</i><div class="subMenuText">用户<span class="fR caret caret-triangle"></span></div></a></h2>
- <div class="subMenuContent">
- <ul>
- <li><a href="admin-newsUser.html">最新用户</a></li>
- <li><a href="admin-onlineUser.html">在线用户</a></li>
- <li><a href="admin-allUser.html">所有用户</a></li>
- <li><a href="admin-countTime.html">时长统计</a></li>
- </ul>
- </div>
- </div>
- <div class="subMenu">
- <h2 class="subMenuTitle"><a class="active"><i class="iconImg icon-">C</i><div class="subMenuText">数据分析<span class="fR caret caret-triangle"></span></div></a></h2>
- <div class="subMenuContent">
- <ul>
- <li><a href="admin-users.html">用户注册分析</a></li>
- <li><a href="admin-produce.html">产品分析</a></li>
- <li><a href="admin-count.html">客户分布</a></li>
- <li><a href="admin-channel.html">获取渠道</a></li>
- </ul>
- </div>
- </div>
- <div class="subMenu">
- <h2 class="subMenuTitle"><a><i class="iconImg icon-">A</i><div class="subMenuText">固化清单<span class="fR caret caret-triangle"></span></div></a></h2>
- <div class="subMenuContent">
- <ul>
- <li><a href="admin-softList.html">用户列表</a></li>
- </ul>
- </div>
- </div>
- </div>
- <div class="userMain">
- <div class="userContent">
- <span><img class="userImg" src="images/01.jpg"></span>
- <div class="subMenuText userName"><a href="admin-userinfo.html">管理员</a> <a class="exit" href="#"><span class="glyphicon glyphicon-log-out"></span> 退出</a></div>
- </div>
- </div>
- </div>
- <!-- leftWrapper end -->
- <div class="mainWrapper container-fluid">
- <div class="page-header pageTop">
- <h3>新增用户分析
- <small class="btnTime">
- <select class="form-control input-sm" style="width:auto; display:inline-block; margin-right:15px;">
- <option>-全国-</option>
- <option>重庆</option>
- <option>湖南</option>
- <option>广东</option>
- <option>山东</option>
- <option>四川</option>
- <option>江西</option>
- <option>甘肃</option>
- <option>广西</option>
- <option>安徽</option>
- <option>河南</option>
- <option>内蒙古</option>
- <option>云南</option>
- <option>浙江</option>
- <option>北京</option>
- <option>贵州</option>
- <option>江苏</option>
- <option>湖北</option>
- <option>福建</option>
- <option>陕西</option>
- <option>吉林</option>
- <option>新疆</option>
- <option>河北</option>
- <option>辽宁</option>
- <option>山西</option>
- <option>黑龙江</option>
- <option>天津</option>
- <option>上海</option>
- <option>海南</option>
- <option>青海</option>
- <option>西藏</option>
- <option>宁夏</option>
- <option>其他</option>
- </select>
- <a href="#">7天内</a> |
- <a href="#">30天内</a> |
- <input type="text" name="date" id="date_demo1" value="" class="form-control gri_date input-sm" style=" width:auto; display:inline-block;"/>
- <script type="text/javascript">
- //var STATS_START_TIME = '1329148800';
- var dateRange1 = new pickerDateRange('date_demo1', {
- isTodayValid : true,
- //isSingleDay : true,
- startDate : '2016-03-12',
- endDate : '2016-03-20',
- needCompare : false,
- defaultText : ' 至 ',
- target : 'datePicker_demo1',
- calendars : 3,
- //theme : 'ta',
- //shortOpr : true,
- success : function(obj) {
- $("#dCon_demo1").html('开始时间 : ' + obj.startDate + '<br/>结束时间 : ' + obj.endDate);
- }
- });
- </script>
- </small>
- </h3>
- </div>
- <div class="chartContent">
- <div class="CountMain" id="CountMainYh" style="height:350px;"></div>
- </div>
- <div class="proSection clearfix">
- <div class="fL chartContent" style="width:50%;">
- <div class="CountMain" id="CountMainMonth" style="height:350px;"></div>
- </div>
- <div class="fL tableContent" style="width:50%;">
- <p class="tipMain">点击查看详情:</p>
- <div style="height:345px; overflow-y:auto;">
- <table class="table table-hover table-striped tablelist">
- <thead>
- <tr>
- <th>地区</th>
- <th class="taCble">人数(人)</th>
- </tr>
- </thead>
- <tr>
- <td><a href="admin-produce.html">重庆</a></td>
- <td>456</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">湖南</a></a></td>
- <td>200</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">广东</a></td>
- <td>141</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">山东</a></td>
- <td>97</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">四川</a></td>
- <td>1</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">江西</a></td>
- <td>12</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">甘肃</a></td>
- <td>67</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">广西</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">安徽</a></td>
- <td>456</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">河南</a></td>
- <td>200</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">内蒙古</a></td>
- <td>141</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">云南</a></td>
- <td>97</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">浙江</a></td>
- <td>1</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">北京</a></td>
- <td>12</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">贵州</a></td>
- <td>67</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">江苏</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">湖北</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">福建</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">陕西</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">吉林</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">新疆</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">河北</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">辽宁</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">山西</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">黑龙江</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">天津</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">上海</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">海南</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">青海</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">西藏</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">宁夏</a></td>
- <td>86</td>
- </tr>
- <tr>
- <td><a href="admin-produce.html">其他</a></td>
- <td>86</td>
- </tr>
- </table>
- </div>
- </div>
- </div>
- </div>
- <!-- mainWrapper end -->
- </div>
- <script type="text/javascript">
- // 基于准备好的dom,初始化echarts实例
- var myChart = echarts.init(document.getElementById('CountMainYh'));
- // 指定图表的配置项和数据
- option = {
- title: {
- text: '用户月数据分析'
- },
- tooltip: {
- trigger: 'axis'
- },
- legend: {
- data:['总注册人数']
- },
- grid: {
- left: '2%',
- right: '3%',
- bottom: '3%',
- containLabel: true
- },
- toolbox: {
- show: false,
- feature: {
- saveAsImage: {}
- }
- },
- xAxis: {
- name:'日期',
- type: 'category',
- boundaryGap: false,
- splitLine: {
- show: true,
- interval: 'auto'
- },
- data: ['01-01','01-02','01-03','01-04','01-05','01-06','01-07','01-08','01-09','01-10','01-11','01-12','01-13','01-14','01-15','01-16','01-17','01-18','01-19','01-20','01-21','01-22','01-23','01-24','01-25','01-26','01-27','01-28','01-29','01-30']
- },
- yAxis: {
- name:'人数',
- type: 'value'
- },
- series: [
- {
- name:'总注册人数',
- type:'line',
- data:[101,155,200,80,186,134,126,168,132,105,90,89,136,155,160,166,132,89,101,206,188,163,136,116,138,155,160,144,123,120],
- markPoint: {
- data: [
- {type: 'max', name: '最大值'},
- {type: 'min', name: '最小值'}
- ]
- }
- }
- ]
- };
- // 使用刚指定的配置项和数据显示图表。
- myChart.setOption(option);
- // 基于准备好的dom,初始化echarts实例
- var myChart = echarts.init(document.getElementById('CountMainMonth'), 'macarons');
- // 指定图表的配置项和数据
- option = {
- title : {
- text: '新增用户省份分布',
- x:'center'
- },
- tooltip : {
- trigger: 'item',
- formatter: "{a} <br/>{b} : {c} ({d}%)"
- },
- legend: {
- orient: 'vertical',
- x: '0',
- data: ['重庆','湖南','广东','山东','四川','江西','甘肃','广西','安徽','河南','内蒙古','云南','浙江','北京','贵州','江苏','湖北','福建','陕西','吉林','新疆','河北','辽宁','山西','黑龙江','天津','上海','海南','青海','西藏','宁夏','其他']
- },
- series : [
- {
- name:'客户分布',
- type:'pie',
- radius : ['55%', '80%'],
- itemStyle : {
- normal : {
- label : {
- show : false,
- },
- labelLine : {
- show : false
- }
- },
- emphasis : {
- label : {
- show : true,
- position : 'center',
- textStyle : {
- fontSize : '30',
- fontWeight : 'bold'
- }
- }
- }
- },
- data:[
- {value:4783, name:'重庆'},
- {value:3543, name:'湖南'},
- {value:3225, name:'广东'},
- {value:2321, name:'山东'},
- {value:1769, name:'四川'},
- {value:1737, name:'江西'},
- {value:1568, name:'甘肃'},
- {value:1516, name:'广西'},
- {value:1434, name:'安徽'},
- {value:1416, name:'河南'},
- {value:1160, name:'内蒙古'},
- {value:1146, name:'云南'},
- {value:1144, name:'浙江'},
- {value:1069, name:'北京'},
- {value:1044, name:'贵州'},
- {value:950, name:'江苏'},
- {value:820, name:'湖北'},
- {value:764, name:'福建'},
- {value:710, name:'陕西'},
- {value:707, name:'吉林'},
- {value:473, name:'新疆'},
- {value:461, name:'河北'},
- {value:308, name:'辽宁'},
- {value:273, name:'山西'},
- {value:217, name:'黑龙江'},
- {value:168, name:'天津'},
- {value:161, name:'上海'},
- {value:135, name:'海南'},
- {value:110, name:'青海'},
- {value:42, name:'西藏'},
- {value:42, name:'宁夏'},
- {value:494, name:'其他'}
- ]
- }
- ]
- };
- // 使用刚指定的配置项和数据显示图表。
- myChart.setOption(option);
- </script>
- </body>
- </html>
-
|