|
|
<!DOCTYPE html>
|
|
|
<html>
|
|
|
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<title>长春市教育基础库运行监测</title>
|
|
|
<meta name="renderer" content="webkit">
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
|
|
<link rel="stylesheet" href="../../static/css/weadmin.css">
|
|
|
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
|
|
|
<!--[if lt IE 9]>
|
|
|
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
|
|
|
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
|
|
|
<![endif]-->
|
|
|
<style>
|
|
|
* {
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
.bg-img {
|
|
|
background: url("../../images/bg.jpg") no-repeat;
|
|
|
background-size: 100% 100%;
|
|
|
position: fixed;
|
|
|
top: 0;
|
|
|
left: 0;
|
|
|
height: 100%;
|
|
|
width: 100%;
|
|
|
z-index: -10;
|
|
|
}
|
|
|
.header {
|
|
|
font:normal 2rem/4.5rem "microsoft yahei";
|
|
|
color: #fff;
|
|
|
text-align: center;
|
|
|
}
|
|
|
.box {
|
|
|
overflow: hidden;
|
|
|
clear:both;
|
|
|
width: 100%;
|
|
|
margin:0 10px;
|
|
|
height: calc(100% - 4.5rem - 10px) ;
|
|
|
}
|
|
|
.box>div {
|
|
|
/*width: calc( (100% - 40px)/3 );*/
|
|
|
float: left;
|
|
|
height: 100%;
|
|
|
position: relative;
|
|
|
margin-right:10px;
|
|
|
}
|
|
|
.box .left,.box .right {
|
|
|
width: 26%;
|
|
|
}
|
|
|
.box .right {
|
|
|
width: calc(26% - 10px);
|
|
|
}
|
|
|
.box .middle {
|
|
|
width: calc(48% - 30px);
|
|
|
}
|
|
|
.box>div>div {
|
|
|
width: 100%;
|
|
|
height: calc( (100% - 30px)/3);
|
|
|
padding:3px 10px 10px 10px;
|
|
|
margin-bottom: 10px;
|
|
|
background-color:rgba(33,55,129,0.5);
|
|
|
position: relative;
|
|
|
}
|
|
|
.layui-table-cell {
|
|
|
height: 24px!important;
|
|
|
line-height: 24px!important;
|
|
|
}
|
|
|
.layui-table-view .layui-table td, .layui-table-view .layui-table th {
|
|
|
padding: 3px 0!important;
|
|
|
}
|
|
|
.box>div:nth-child(2)>div:nth-child(1) {
|
|
|
height:53%;
|
|
|
width: 100%;
|
|
|
}
|
|
|
.box>div:nth-child(2)>div:nth-child(2) {
|
|
|
height:calc(47% - 20px);
|
|
|
width: 100%;
|
|
|
}
|
|
|
.daySel {
|
|
|
background: #078dff;
|
|
|
}
|
|
|
::-webkit-scrollbar {
|
|
|
width: 0px;
|
|
|
}
|
|
|
.layui-table,.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table-total, .layui-table-total tr, .layui-table[lay-even] tr:nth-child(2n) {
|
|
|
background-color: transparent!important;
|
|
|
color: #fff!important;
|
|
|
margin: 3px 0px 0px 0px!important;
|
|
|
}
|
|
|
.layui-table td, .layui-table th, .layui-table-col-set, .layui-table-fixed-r, .layui-table-grid-down, .layui-table-header, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-total, .layui-table-view, .layui-table[lay-skin="line"], .layui-table[lay-skin="row"] {
|
|
|
border-color:#547dc2!important;
|
|
|
}
|
|
|
.layui-table {
|
|
|
width: 100%!important;
|
|
|
}
|
|
|
.topL { width: 11px; height: 11px; border-top-width: 2px; border-top-color: #3690ff; border-top-style: solid; border-left-width: 2px; border-left-color: #3690ff; border-left-style: solid; position: absolute; top: 0px; left: 0px; }
|
|
|
.topR { width: 11px; height: 11px; border-top-width: 2px; border-top-color: #3690ff; border-top-style: solid; border-right-width: 2px; border-right-color: #3690ff; border-right-style: solid; position: absolute; top: 0px; right: 0px; }
|
|
|
.bottomL { width: 11px; height: 11px; border-bottom-width: 2px; border-bottom-color: #3690ff; border-bottom-style: solid; border-left-width: 2px; border-left-color: #3690ff; border-left-style: solid; position: absolute; bottom: 0px; left: 0px; }
|
|
|
.bottomR { width: 11px; height: 11px; border-bottom-width: 2px; border-bottom-color: #3690ff; border-bottom-style: solid; border-right-width: 2px; border-right-color: #3690ff; border-right-style: solid; position: absolute; bottom:0px; right: 0px; }
|
|
|
.portal-title { border-bottom: 1px solid #547dc2; font: normal 16px/28px "microsoft yahei"; color: #b1d4ff; margin-top: 12px; position:relative; }
|
|
|
.portal-title span img { margin-right: 4px; }
|
|
|
.portal-title h2{ text-align:center; font: normal 24px/22px "microsoft yahei"; color: #d7e8ff; padding-left:30px;}
|
|
|
.portal-title h2 span{ font: normal 12px/22px "microsoft yahei"; color: #3690ff; padding-left:5px;}
|
|
|
.timeSelect{border:1px solid #3690ff;padding: 1px 5px 1px 5px;color: #fff;font-size: 14px;margin-left: 0;cursor: pointer}
|
|
|
#appCount {
|
|
|
border: 1px solid #547dc2;
|
|
|
margin-top: 10px;
|
|
|
}
|
|
|
.tableList {
|
|
|
clear: both;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
ol.tableList, ul.ulLI li {
|
|
|
border-bottom: 2px solid #547dc2;
|
|
|
}
|
|
|
ul.ulLI {
|
|
|
padding: 0 10px;
|
|
|
height: calc(100% - 50px);
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
ul.ulLI li {
|
|
|
clear: both;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
ul.ulLI li div:nth-child(4n) {
|
|
|
color: greenyellow;
|
|
|
}
|
|
|
ol.tableList li,.ulLI li div {
|
|
|
float: left;
|
|
|
height: 32px;
|
|
|
line-height: 32px;
|
|
|
text-align: center;
|
|
|
color: #fff;
|
|
|
width: 25%;
|
|
|
}
|
|
|
#news {
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
#detail {
|
|
|
border: 2px solid #547dc2;
|
|
|
position: absolute;
|
|
|
width:48%;
|
|
|
height:45%;
|
|
|
padding: 5px;
|
|
|
top:45%;
|
|
|
right: 2%;
|
|
|
z-index: 999999;
|
|
|
}
|
|
|
#detail span{
|
|
|
font-size: 16px;
|
|
|
display: block;
|
|
|
width: 100%;
|
|
|
padding: 0 15px;
|
|
|
height: 32px;
|
|
|
line-height: 32px;
|
|
|
color: #fff;
|
|
|
border-bottom: 2px solid #547dc2;
|
|
|
}
|
|
|
#detail span::before {
|
|
|
content: "";
|
|
|
display: inline-block;
|
|
|
width: 12px;
|
|
|
height: 12px;
|
|
|
margin-right: 11px;
|
|
|
border-radius: 50%;
|
|
|
background-color: #00ffff;
|
|
|
}
|
|
|
.count {
|
|
|
padding: 8px;
|
|
|
position: absolute;
|
|
|
top: 10%;
|
|
|
left: 0;
|
|
|
color:#fff;
|
|
|
width: 100%;
|
|
|
z-index:9999999999999;
|
|
|
}
|
|
|
.count li {
|
|
|
width: 24.25%;
|
|
|
box-sizing: border-box;
|
|
|
margin-right: 1%;
|
|
|
height: 117px;
|
|
|
padding: 10px;
|
|
|
border: 2px solid #547dc2;
|
|
|
float: left;
|
|
|
background-color: rgba(255,255,255,0.1);
|
|
|
box-shadow: 4px 4px 10px #02050E;
|
|
|
}
|
|
|
.count li:last-child {
|
|
|
margin-right: 0;
|
|
|
}
|
|
|
.count li .title {
|
|
|
height: 30px;
|
|
|
}
|
|
|
.count li p {
|
|
|
height:46px;
|
|
|
line-height:36px;
|
|
|
font-size: 30px;
|
|
|
color: #00ffff;
|
|
|
text-shadow:0 0 6px #fff, -0 -0 6px #fff;
|
|
|
}
|
|
|
.fl {
|
|
|
float: left;
|
|
|
}
|
|
|
.switchBtn {
|
|
|
background-color: #37a2da;
|
|
|
padding: 5px 12px;
|
|
|
color: #fff;
|
|
|
border-radius: 4px;
|
|
|
margin-top: 4px;
|
|
|
position: absolute;
|
|
|
right: 10px;
|
|
|
cursor: pointer;
|
|
|
display: none;
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
<body style="width: 100%;height: 100%;">
|
|
|
<div class="bg-img"></div>
|
|
|
<div class="header">长春市教育基础库运行监测</div>
|
|
|
<div class="box">
|
|
|
<div class="left">
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title"> <span><img src="../../images/icon01.png"></span>学校类型分布</div>
|
|
|
<div id="radar" style="width: 100%;height: 88%;"></div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title"> <span><img src="../../images/icon01.png"></span>最活跃学校TOP10</div>
|
|
|
<div>
|
|
|
<table class="layui-table" lay-filter="demo" id="idTest"></table>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title">
|
|
|
<span><img src="../../images/icon01.png">学生数统计</span>
|
|
|
</div>
|
|
|
<div style="margin-top: 10px;text-align: center;">
|
|
|
<div style="display: inline-block;text-align: center;" class="stu">
|
|
|
<!--<label class="timeSelect daySel" id="ty" >通用</label> -->
|
|
|
<label class="timeSelect daySel" id="ye" index="0" >幼儿</label>
|
|
|
<label class="timeSelect" id="xx" index="1" >小学</label>
|
|
|
<label class="timeSelect" id="cz" index="2" >初中</label>
|
|
|
<label class="timeSelect" id="gz" index="3" >高中</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div id="stu" style="width: 100%;height:86%"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="middle">
|
|
|
<div style="position: relative">
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title"> <span><img src="../../images/icon01.png"></span> 系统状态监测</div>
|
|
|
<div style="width: 80%;height: 100%;" id="mapDiv">
|
|
|
<iframe src="./test.html" width="80%" frameborder="0" height="100%">
|
|
|
</iframe>
|
|
|
</div>
|
|
|
<ul class="count" >
|
|
|
<li>
|
|
|
<div class="title">
|
|
|
<span class="fl">学校总数</span><span class="layui-badge layui-bg-orange fr">所</span>
|
|
|
</div>
|
|
|
<p id="school"></p>
|
|
|
<div>
|
|
|
<span class="fl">本学期新增</span>
|
|
|
<div class="fr">
|
|
|
<span id="curr_school"></span> 所
|
|
|
</div>
|
|
|
</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div class="title">
|
|
|
<span class="fl">单位总数</span><span class="layui-badge layui-bg-blue fr">所</span>
|
|
|
</div>
|
|
|
<p id="dw"></p>
|
|
|
<div>
|
|
|
<span class="fl">本学期新增</span>
|
|
|
<div class="fr">
|
|
|
<span id="curr_dw"></span> 所
|
|
|
</div>
|
|
|
</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div class="title">
|
|
|
<span class="fl">教工总数</span><span class="layui-badge layui-bg-green fr">人</span>
|
|
|
</div>
|
|
|
<p id="tea"></p>
|
|
|
<div>
|
|
|
<span class="fl">本学期新增</span>
|
|
|
<div class="fr">
|
|
|
<span id="curr_tea"></span> 人
|
|
|
</div>
|
|
|
</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div class="title">
|
|
|
<span class="fl">学生总数</span><span class="layui-badge layui-bg-yellow fr">人</span>
|
|
|
</div>
|
|
|
<p id="stuCount"></p>
|
|
|
<div>
|
|
|
<span class="fl">本学期新增</span>
|
|
|
<div class="fr">
|
|
|
<span id="curr_stu"></span> 人
|
|
|
</div>
|
|
|
</div>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<div id="detail">
|
|
|
<span>访问日志监测</span>
|
|
|
<div id="map_1" style="width:50%;float: left;height:90%;"></div>
|
|
|
<div id="map_2" style="width: 50%;float: left;height: 80%;"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title" style="line-height: 28px;height: 28px;">
|
|
|
<span><img src="../../images/icon01.png"></span>教职工人数与学生人数分布
|
|
|
</div>
|
|
|
<div id="teastu" style="width: 100%;height:98%;"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title"> <span><img src="../../images/icon01.png"></span>市直属学校登录排名 </div>
|
|
|
<div id="visit" style="width: 100%;height:88%;"></div>
|
|
|
<div id="visitTable" style="width: 100%;height:88%;display:none">
|
|
|
<table class="layui-table" lay-filter="demo1" id="idTest1"></table>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title"> <span><img src="../../images/icon01.png"></span>县区登录排名Top5 </div>
|
|
|
<div id="districtTeaStu" style="width: 100%;height:96%;"></div>
|
|
|
<div id="districtTeaStuTable" style="width: 100%;height:88%;display:none">
|
|
|
<table class="layui-table" lay-filter="demo2" id="idTest2"></table>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
<i class="topL"></i>
|
|
|
<i class="topR"></i>
|
|
|
<i class="bottomL"></i>
|
|
|
<i class="bottomR"></i>
|
|
|
<div class="portal-title"> <span><img src="../../images/icon01.png"></span>第三方平台访问数统计</div>
|
|
|
<div id="appCount" style="width: 100%;height:78%;overflow: hidden">
|
|
|
<ol class="tableList">
|
|
|
<li>平台名称</li>
|
|
|
<li>访问人数/人</li>
|
|
|
<li>访问次数/次</li>
|
|
|
<li>增长率</li>
|
|
|
</ol>
|
|
|
<div id="news">
|
|
|
<ul class="ulLI">
|
|
|
<li>
|
|
|
<div>综合评价系统</div>
|
|
|
<div>98741</div>
|
|
|
<div>126449</div>
|
|
|
<div>32%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>吃掉物理</div>
|
|
|
<div>198741</div>
|
|
|
<div>326449</div>
|
|
|
<div>6%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>虚拟实验室</div>
|
|
|
<div>18741</div>
|
|
|
<div>96449</div>
|
|
|
<div>20%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>理想生涯</div>
|
|
|
<div>741</div>
|
|
|
<div>6449</div>
|
|
|
<div>46%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>综合评价系统</div>
|
|
|
<div>98741</div>
|
|
|
<div>126449</div>
|
|
|
<div>32%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>吃掉物理</div>
|
|
|
<div>198741</div>
|
|
|
<div>326449</div>
|
|
|
<div>6%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>虚拟实验室</div>
|
|
|
<div>18741</div>
|
|
|
<div>96449</div>
|
|
|
<div>20%</div>
|
|
|
</li>
|
|
|
<li>
|
|
|
<div>理想生涯</div>
|
|
|
<div>741</div>
|
|
|
<div>6449</div>
|
|
|
<div>46%</div>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<script src="../../lib/jquery-3.6.0.min.js"></script>
|
|
|
<script src="./echarts.min.js"></script>
|
|
|
<script src="../../lib/layui/layui.js"></script>
|
|
|
<script>
|
|
|
layui.extend({
|
|
|
admin: '{/}../../static/js/admin'
|
|
|
});
|
|
|
layui.use(['jquery', 'admin', 'table'], function () {
|
|
|
var $ = layui.jquery,
|
|
|
admin = layui.admin,
|
|
|
table = layui.table;
|
|
|
|
|
|
function numFormat(num) {
|
|
|
num = num + '';//数字转字符串
|
|
|
var str = "";//字符串累加
|
|
|
for (var i = num.length - 1, j = 1; i >= 0; i--, j++) {
|
|
|
if (j % 3 == 0 && i != 0) {//每隔三位加逗号，过滤正好在第一个数字的情况
|
|
|
str += num[i] + ",";//加千分位逗号
|
|
|
continue;
|
|
|
}
|
|
|
str += num[i];//倒着累加数字
|
|
|
}
|
|
|
return str.split('').reverse().join("");//字符串=>数组=>反转=>字符串
|
|
|
}
|
|
|
|
|
|
|
|
|
var result=getGlobalByCodes("install_area");
|
|
|
var info=getcookie();// 1超级 2市 3区县 4单位
|
|
|
var areaId="";
|
|
|
// 只有超管 和市管理员可见
|
|
|
if(info.identity_id==1){
|
|
|
areaId=result[0].global_value;
|
|
|
}else if(info.identity_id==2){
|
|
|
areaId=info.city_id;
|
|
|
}
|
|
|
|
|
|
|
|
|
// left --1 雷达图
|
|
|
var radar = echarts.init(document.getElementById('radar'),'light');
|
|
|
// 获取雷达图数据
|
|
|
function getSchoolCountAggsAreaSchoolTypeByCityId(){
|
|
|
var lis=[];
|
|
|
$.ajax({
|
|
|
type: 'GET',
|
|
|
dataType: 'json',
|
|
|
async:false,
|
|
|
url: '/FengHuang/bigData/getSchoolCountAggsAreaSchoolTypeByCityId?city_id='+areaId,
|
|
|
success: function (data) {
|
|
|
data.sort(function (a, b) {
|
|
|
return a.sort_id - b.sort_id;
|
|
|
})
|
|
|
lis=data;
|
|
|
}
|
|
|
})
|
|
|
return lis;
|
|
|
}
|
|
|
var radarLis=getSchoolCountAggsAreaSchoolTypeByCityId();
|
|
|
var radaryAxisLis = [];//y轴区域
|
|
|
var radardataList=[];
|
|
|
for (var i = 0; i < radarLis.length; i++) {
|
|
|
radaryAxisLis.push(radarLis[i].area_name);
|
|
|
radardataList.push( {
|
|
|
value : [radarLis[i].ye, radarLis[i].xx,radarLis[i].cz, radarLis[i].gz, radarLis[i].jnygz, radarLis[i].senygz, radarLis[i].wqzx, radarLis[i].xycgyt, radarLis[i].xycyt, radarLis[i].xyyt],
|
|
|
name : radarLis[i].area_name
|
|
|
})
|
|
|
}
|
|
|
radar.setOption({
|
|
|
backgroundColor: '#132d64',
|
|
|
tooltip: {
|
|
|
position:['50%','50%']
|
|
|
},
|
|
|
legend: {
|
|
|
textStyle:{
|
|
|
color:'#fff'
|
|
|
},
|
|
|
type: 'scroll',
|
|
|
left: 10,
|
|
|
top: 10,
|
|
|
bottom:0,
|
|
|
show:true,
|
|
|
pageIconInactiveColor:'#547dc2',
|
|
|
pageIconColor:'#00ffff',
|
|
|
orient: 'vertical', //垂直显示
|
|
|
// y: 'top', //延Y轴居中
|
|
|
// x: 'left', //居右显示
|
|
|
// padding:1, //调节legend的位置
|
|
|
data: radaryAxisLis,
|
|
|
// itemGap:15,
|
|
|
},
|
|
|
radar: {
|
|
|
name: {
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
backgroundColor: 'transparent',
|
|
|
borderRadius: 3,
|
|
|
padding: [3, 5]
|
|
|
}
|
|
|
},
|
|
|
indicator: [
|
|
|
{ name: '幼儿'},
|
|
|
{ name: '小学'},
|
|
|
{ name: '初中'},
|
|
|
{ name: '高中'},
|
|
|
{ name: '完全中学'},
|
|
|
{ name: '九年一贯制'},
|
|
|
{ name: '十二年一贯制'},
|
|
|
{ name: '小幼一体'},
|
|
|
{ name: '小幼初一体'},
|
|
|
{ name: '小幼初高一体'}
|
|
|
],
|
|
|
shape: 'circle',
|
|
|
name: {
|
|
|
textStyle: {
|
|
|
color: 'rgb(238, 197, 102)'
|
|
|
}
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
color: [
|
|
|
'rgba(238, 197, 102, 0.1)', 'rgba(238, 197, 102, 0.2)',
|
|
|
'rgba(238, 197, 102, 0.4)', 'rgba(238, 197, 102, 0.6)',
|
|
|
'rgba(238, 197, 102, 0.8)', 'rgba(238, 197, 102, 1)'
|
|
|
].reverse()
|
|
|
}
|
|
|
},
|
|
|
splitArea: {
|
|
|
show: false
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: 'rgba(238, 197, 102, 0.5)'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
series: [{
|
|
|
type: 'radar',
|
|
|
data : radardataList
|
|
|
}]
|
|
|
},'light')
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// middle--1 获取市 下学校 单位 学生 教工总数
|
|
|
getSchoolOrgTeaStuCountByCityId();
|
|
|
function getSchoolOrgTeaStuCountByCityId(){
|
|
|
$.ajax({
|
|
|
type:'GET',
|
|
|
dataType:'json',
|
|
|
url:'/FengHuang/bigData/getSchoolOrgTeaStuCountByCityId?city_id='+areaId,
|
|
|
success:function (data) {
|
|
|
if(data.success){
|
|
|
$("#school").text(numFormat(data.school_count));
|
|
|
$("#dw").text(numFormat(data.org_count));
|
|
|
$("#tea").text(numFormat(data.teacher_count));
|
|
|
$("#stuCount").text(numFormat(data.student_count));
|
|
|
$("#curr_school").text(numFormat(data.curr_term_school_count));
|
|
|
$("#curr_dw").text(numFormat(data.curr_term_org_count));
|
|
|
$("#curr_tea").text(numFormat(data.curr_term_teacher_count));
|
|
|
$("#curr_stu").text(numFormat(data.curr_term_student_count));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
})
|
|
|
}
|
|
|
|
|
|
|
|
|
//left --3 学段--入学年份--学生数
|
|
|
var stu = echarts.init(document.getElementById('stu'),'light');
|
|
|
// 获取 学段--入学年份--学生数数据
|
|
|
function getStuCountAggsEntryYearByCityIdStageId(id){
|
|
|
var lis=[];
|
|
|
$.ajax({
|
|
|
type: "GET",
|
|
|
dataType: 'json',
|
|
|
async:false,
|
|
|
url: '/FengHuang/bigData/getStuCountAggsEntryYearByCityIdStageId?city_id='+areaId+'&stage_id='+id,
|
|
|
success: function (data) {
|
|
|
// refreshData(id,entryList,countList)
|
|
|
if(data.success){
|
|
|
data.list.sort(function (a,b) {
|
|
|
return b.entry_year -a.entry_year
|
|
|
})
|
|
|
lis =data.list;
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
return lis;
|
|
|
}
|
|
|
var lis=getStuCountAggsEntryYearByCityIdStageId(8);
|
|
|
var stuentryList=[];
|
|
|
var stucountList=[];
|
|
|
for (var i = 0; i < lis.length;i++) {
|
|
|
stuentryList.push(lis[i].entry_year);
|
|
|
stucountList.push(lis[i].count);
|
|
|
}
|
|
|
stu.setOption(
|
|
|
{
|
|
|
tooltip: {
|
|
|
trigger: 'axis'
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
boundaryGap: false,
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
}
|
|
|
},
|
|
|
axisLine:{
|
|
|
lineStyle:{
|
|
|
color:'#547dc2',
|
|
|
}
|
|
|
},
|
|
|
data: stuentryList,
|
|
|
inverse:true
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
}
|
|
|
},
|
|
|
axisLine:{
|
|
|
lineStyle:{
|
|
|
color:'#547dc2',
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
name:'学生总数',
|
|
|
type:'line',
|
|
|
data:stucountList,
|
|
|
markPoint: {
|
|
|
data: [
|
|
|
{type: 'max', name: '最大值'},
|
|
|
{type: 'min', name: '最小值'}
|
|
|
]
|
|
|
},
|
|
|
markLine: {
|
|
|
data: [
|
|
|
{type: 'average', name: '平均值'}
|
|
|
],
|
|
|
lineStyle:{
|
|
|
color:'#547dc2',
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
]},true)
|
|
|
// 处理折线数据
|
|
|
var lineIndex=-1;
|
|
|
var stage_id="";
|
|
|
// 10s刷新一次折线图
|
|
|
function dealLineData() {
|
|
|
lineIndex = lineIndex + 1 !== 4 ? lineIndex + 1 : 0;
|
|
|
$(".stu label[index='" + lineIndex + "']").addClass('daySel').siblings().removeClass('daySel');
|
|
|
// 0 幼儿8 1小学4 2初中5 3高中6
|
|
|
if (lineIndex == 0) {
|
|
|
stage_id = 8;
|
|
|
} else if (lineIndex == 1) {
|
|
|
stage_id = 4;
|
|
|
|
|
|
} else if (lineIndex == 2) {
|
|
|
stage_id = 5;
|
|
|
|
|
|
} else if (lineIndex == 3) {
|
|
|
stage_id = 6;
|
|
|
}
|
|
|
var lis = getStuCountAggsEntryYearByCityIdStageId(stage_id);
|
|
|
var stuentryList = [];
|
|
|
var stucountList = [];
|
|
|
for (var i = 0; i < lis.length; i++) {
|
|
|
stuentryList.push(lis[i].entry_year);
|
|
|
stucountList.push(lis[i].count);
|
|
|
}
|
|
|
if(!stu){
|
|
|
return;
|
|
|
}
|
|
|
var option = stu.getOption();
|
|
|
option.series[0].data=stucountList;
|
|
|
option.xAxis[0].data=stuentryList;
|
|
|
stu.setOption(option);
|
|
|
}
|
|
|
setInterval(function () {
|
|
|
dealLineData();
|
|
|
},10000)
|
|
|
|
|
|
|
|
|
|
|
|
// 10分钟更新一次
|
|
|
setInterval(function () {
|
|
|
getSchoolOrgTeaStuCountByCityId();//获取教师 单位 学校 学生总数
|
|
|
refreshDataList();//刷新雷达图
|
|
|
},600000)
|
|
|
|
|
|
|
|
|
//刷新echarts
|
|
|
function refreshDataList(){
|
|
|
if(!radar){
|
|
|
return;
|
|
|
}
|
|
|
if(!teastu){
|
|
|
return;
|
|
|
}
|
|
|
// 雷达图
|
|
|
var option = radar.getOption();
|
|
|
var radarLis=getSchoolCountAggsAreaSchoolTypeByCityId();
|
|
|
var yAxisLis = [];//y轴区域
|
|
|
var dataList=[];
|
|
|
for (var i = 0; i < radarLis.length; i++) {
|
|
|
yAxisLis.push(radarLis[i].area_name);
|
|
|
dataList.push( {
|
|
|
value : [radarLis[i].ye, radarLis[i].xx,radarLis[i].cz, radarLis[i].gz, radarLis[i].jnygz, radarLis[i].senygz, radarLis[i].wqzx, radarLis[i].xycgyt, radarLis[i].xycyt, radarLis[i].xyyt],
|
|
|
name : radarLis[i].area_name
|
|
|
})
|
|
|
}
|
|
|
option.series[0].data=dataList;
|
|
|
option.legend.data=yAxisLis;
|
|
|
radar.setOption(option);
|
|
|
|
|
|
// middle--2 按学校类型聚合教师学生数
|
|
|
var option2 = teastu.getOption();
|
|
|
var schooltypeList=getTeaStuCountAggsSchoolTypeByCityId();
|
|
|
var stuList=[],teaList=[];
|
|
|
for (var i=0;i<schooltypeList.length;i++){
|
|
|
stuList.push({
|
|
|
value:schooltypeList[i]['stu_count'],
|
|
|
name:schooltypeList[i].type
|
|
|
})
|
|
|
teaList.push({
|
|
|
value:schooltypeList[i]['tea_count'],
|
|
|
name:schooltypeList[i].type
|
|
|
})
|
|
|
}
|
|
|
option2.series[0].data=stuList;
|
|
|
option2.series[1].data=teaList;
|
|
|
teastu.setOption(option2);
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//left --2 表格最活跃学校
|
|
|
var showIndex=0;
|
|
|
var table1=[];
|
|
|
var table2=[];
|
|
|
var dataList=[];
|
|
|
getTableData();
|
|
|
function getTableData(){
|
|
|
$.ajax({
|
|
|
type:'GET',
|
|
|
async:false,
|
|
|
url:'/FengHuang/bigData/getActiveListAggsBureauByCityId?city_id='+areaId+'&limit=10',
|
|
|
success:function (data) {
|
|
|
for (var i=0;i<data.list.length;i++){
|
|
|
data.list[i].id=i+1;
|
|
|
}
|
|
|
for (var i=0;i<5;i++) {
|
|
|
table1.push(data.list[i]);
|
|
|
}
|
|
|
for (var i=5;i<10;i++) {
|
|
|
table2.push(data.list[i]);
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
|
|
|
table.render({
|
|
|
elem: '#idTest'
|
|
|
, cols: [[
|
|
|
{field: 'id', title: '序号', align: 'center',width:'15%'}
|
|
|
,{field: 'bureau_name', title: '学校名称', align: 'center'}
|
|
|
, {field: 'area_name', title: '所属区域', align: 'center'}
|
|
|
,{field: 'count', title: '浏览量', align: 'center',width:'20%'}
|
|
|
]]
|
|
|
,data:table1,
|
|
|
limit:'5'
|
|
|
});
|
|
|
}
|
|
|
function dealTableData(){
|
|
|
getTableData();
|
|
|
showIndex=showIndex+1>1 ? 0 :1;
|
|
|
if(showIndex==0){
|
|
|
dataList=table1;
|
|
|
}else{
|
|
|
dataList=table2;
|
|
|
}
|
|
|
table.render({
|
|
|
elem: '#idTest'
|
|
|
, cols: [[
|
|
|
{field: 'id', title: '序号', align: 'center',width:'10%'}
|
|
|
,{field: 'bureau_name', title: '学校名称', align: 'center'}
|
|
|
, {field: 'area_name', title: '所属区域', align: 'center'}
|
|
|
,{field: 'count', title: '浏览量', align: 'center',width:'20%'}
|
|
|
]]
|
|
|
,data:dataList,
|
|
|
// page:true,
|
|
|
limit:'5'
|
|
|
});
|
|
|
}
|
|
|
setInterval(function () {
|
|
|
dealTableData();
|
|
|
},10000)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// middle --2 按学校类型 --教师 学生数量对比
|
|
|
var teastu=echarts.init(document.getElementById('teastu'),'light');
|
|
|
var stuList=[];
|
|
|
var teaList=[];
|
|
|
|
|
|
function getTeaStuCountAggsSchoolTypeByCityId(){
|
|
|
var list;
|
|
|
$.ajax({
|
|
|
type: "GET",
|
|
|
dataType: 'json',
|
|
|
async:false,
|
|
|
url: '/FengHuang/bigData/getTeaStuCountAggsSchoolTypeByCityId?city_id='+areaId,
|
|
|
success: function (data) {
|
|
|
list=data.list;
|
|
|
}
|
|
|
})
|
|
|
return list;
|
|
|
}
|
|
|
var schooltypeList=getTeaStuCountAggsSchoolTypeByCityId();
|
|
|
for (var i=0;i<schooltypeList.length;i++){
|
|
|
stuList.push({
|
|
|
value:schooltypeList[i]['stu_count'],
|
|
|
name:schooltypeList[i].type
|
|
|
})
|
|
|
teaList.push({
|
|
|
value:schooltypeList[i]['tea_count'],
|
|
|
name:schooltypeList[i].type
|
|
|
})
|
|
|
}
|
|
|
teastu.setOption({
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
|
formatter: "{a} <br/>{b}: {c} ({d}%)"
|
|
|
},
|
|
|
legend: {
|
|
|
orient: 'vertical',
|
|
|
x: 'right',
|
|
|
textStyle:{
|
|
|
color:'#fff'
|
|
|
},
|
|
|
type:'scroll',
|
|
|
data:['幼儿', '小学','初中','高中','完全中学','九年一贯制','十二年一贯制','小幼一体','小幼初一体','小幼初高一体']
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
name:'学生总数',
|
|
|
type:'pie',
|
|
|
selectedMode: 'single',
|
|
|
radius: [0, '50%'],
|
|
|
|
|
|
label: {
|
|
|
normal: {
|
|
|
position: 'inner',
|
|
|
show: false
|
|
|
}
|
|
|
},
|
|
|
labelLine: {
|
|
|
normal: {
|
|
|
show: false
|
|
|
}
|
|
|
},
|
|
|
data:stuList
|
|
|
},
|
|
|
{
|
|
|
name:'教师总数',
|
|
|
type:'pie',
|
|
|
radius: ['60%', '85%'],
|
|
|
label: {
|
|
|
normal: {
|
|
|
formatter: '{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',
|
|
|
backgroundColor: '#183872',
|
|
|
borderColor: '#aaa',
|
|
|
borderWidth:0.5,
|
|
|
borderRadius: 4,
|
|
|
// shadowBlur:3,
|
|
|
// shadowOffsetX: 2,
|
|
|
// shadowOffsetY: 2,
|
|
|
// shadowColor: '#999',
|
|
|
// padding: [0, 7],
|
|
|
rich: {
|
|
|
a: {
|
|
|
color: '#999',
|
|
|
lineHeight:18,
|
|
|
align: 'center'
|
|
|
},
|
|
|
hr: {
|
|
|
borderColor: '#aaa',
|
|
|
width: '100%',
|
|
|
borderWidth: 0.5,
|
|
|
height: 0
|
|
|
},
|
|
|
b: {
|
|
|
fontSize: 10,
|
|
|
lineHeight:18
|
|
|
},
|
|
|
per: {
|
|
|
color: '#eee',
|
|
|
backgroundColor: '#334455',
|
|
|
padding: [0.5, 1],
|
|
|
borderRadius: 2
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
data:teaList
|
|
|
}
|
|
|
]
|
|
|
},true)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// right --2 各区县教师 学生对比
|
|
|
var districtTeaStu=echarts.init(document.getElementById('districtTeaStu'),'light');
|
|
|
var labelOption = {
|
|
|
normal: {
|
|
|
show: true,
|
|
|
position: 'insideBottom',
|
|
|
distance:'25',
|
|
|
align:'left',
|
|
|
verticalAlign:'middle',
|
|
|
rotate:'90',
|
|
|
fontSize: 10,
|
|
|
color:'#fff',
|
|
|
formatter: '{name|{a}} {c}',
|
|
|
rich: {
|
|
|
name: {
|
|
|
// textBorderColor: '#fff'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
function getTeaStuCountAggsAreaByCityId(){
|
|
|
var jsonStr;
|
|
|
$.ajax({
|
|
|
type:'GET',
|
|
|
async:false,
|
|
|
url:'/FengHuang/bigData/getAreaLoginTopByCityId?city_id='+areaId+'&day=30&top=5',
|
|
|
dataType:'json',
|
|
|
success:function (data) {
|
|
|
for (var i=0;i<data.list.length;i++){
|
|
|
data.list[i].id= i+1;
|
|
|
}
|
|
|
table.render({
|
|
|
elem: '#idTest2'
|
|
|
, cols: [[
|
|
|
{field: 'id', title: '序号', align: 'center',width:'15%'}
|
|
|
,{field: 'area_name', title: '县区名称', align: 'center'}
|
|
|
, {field: 'accessCount', title: '登录次数', align: 'center'}
|
|
|
,{field: 'accessPersonCount', title: '登录人数', align: 'center',width:'20%'}
|
|
|
]]
|
|
|
,data:data.list,
|
|
|
limit:'5'
|
|
|
});
|
|
|
var area_name=[];
|
|
|
var teaLis=[];
|
|
|
var xxLis=[];
|
|
|
for (var i=0;i<data.list.length;i++) {
|
|
|
area_name.push(data.list[i].area_name);
|
|
|
xxLis.push(data.list[i]['accessPersonCount']);
|
|
|
teaLis.push(data.list[i]['accessCount']);
|
|
|
}
|
|
|
jsonStr={'area_name':area_name,'xxLis':xxLis,'teaLis':teaLis};
|
|
|
// console.log(jsonStr);
|
|
|
}
|
|
|
})
|
|
|
return jsonStr;
|
|
|
}
|
|
|
var jsonStr=getTeaStuCountAggsAreaByCityId();
|
|
|
districtTeaStu.setOption({
|
|
|
// color: ['#ff9f7f', '#fb7293', '#37a2da', '#96bfff'],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
},
|
|
|
extraCssText:'width:160px;height:100px'
|
|
|
},
|
|
|
legend: {
|
|
|
data: ['登录次数', '登录人数'],
|
|
|
textStyle:{
|
|
|
color:'#fff'
|
|
|
}
|
|
|
},
|
|
|
calculable: true,
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
axisTick: {show: false},
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
},
|
|
|
interval:0,
|
|
|
margin:15,
|
|
|
rotate:40
|
|
|
},
|
|
|
axisLine:{
|
|
|
lineStyle:{
|
|
|
color:'#547dc2',
|
|
|
}
|
|
|
},
|
|
|
data:jsonStr['area_name']
|
|
|
}
|
|
|
],
|
|
|
yAxis: [
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
},
|
|
|
interval:0,
|
|
|
margin:15
|
|
|
},
|
|
|
axisLine:{
|
|
|
lineStyle:{
|
|
|
color:'#547dc2',
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
name: '登录次数',
|
|
|
type: 'bar',
|
|
|
barGap: 0,
|
|
|
label: labelOption,
|
|
|
data:jsonStr.teaLis
|
|
|
},
|
|
|
{
|
|
|
name: '登录人数',
|
|
|
type: 'bar',
|
|
|
label: labelOption,
|
|
|
data:jsonStr.xxLis
|
|
|
}
|
|
|
]
|
|
|
},true)
|
|
|
|
|
|
|
|
|
setInterval(function () {
|
|
|
showIndex=showIndex+1>1 ? 0 :1;
|
|
|
if(showIndex==0){
|
|
|
$('#visit').show();
|
|
|
$('#visitTable').hide();
|
|
|
$('#districtTeaStu').show();
|
|
|
$('#districtTeaStuTable').hide();
|
|
|
}else{
|
|
|
$('#visit').hide();
|
|
|
$('#visitTable').show();
|
|
|
$('#districtTeaStu').hide();
|
|
|
$('#districtTeaStuTable').show();
|
|
|
}
|
|
|
},5000)
|
|
|
|
|
|
|
|
|
// right --1 七天访问人数 次数
|
|
|
var visit=echarts.init(document.getElementById('visit'),'light');
|
|
|
function getCityDirectlySchoolLoginTopByCityId(){
|
|
|
var dataLis;
|
|
|
$.ajax({
|
|
|
type:'GET',
|
|
|
dataType:'json',
|
|
|
async:false,
|
|
|
url:'/FengHuang/bigData/getCityDirectlySchoolLoginTopByCityId?city_id='+areaId+'&day=30&top=5',
|
|
|
success:function (data) {
|
|
|
if(data.success){
|
|
|
for (var i=0;i<data.list.length;i++){
|
|
|
data.list[i].id= i+1;
|
|
|
}
|
|
|
table.render({
|
|
|
elem: '#idTest1'
|
|
|
, cols: [[
|
|
|
{field: 'id', title: '序号', align: 'center',width:'15%'}
|
|
|
,{field: 'org_name', title: '学校名称', align: 'center'}
|
|
|
, {field: 'accessCount', title: '访问次数', align: 'center'}
|
|
|
,{field: 'accessPersonCount', title: '访问人数', align: 'center',width:'20%'}
|
|
|
]]
|
|
|
,data:data.list,
|
|
|
limit:'5'
|
|
|
});
|
|
|
dataLis=data.list;
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
return dataLis;
|
|
|
}
|
|
|
var personLis=[];
|
|
|
var countLis=[];
|
|
|
var dateList=[];
|
|
|
var accessCountLis=getCityDirectlySchoolLoginTopByCityId();
|
|
|
|
|
|
for (var i=0;i<accessCountLis.length;i++) {
|
|
|
personLis.push(accessCountLis[i]['accessPersonCount']);
|
|
|
countLis.push(accessCountLis[i]['accessCount']);
|
|
|
dateList.push(accessCountLis[i]['org_name']);
|
|
|
}
|
|
|
|
|
|
visit.setOption({
|
|
|
tooltip:{
|
|
|
trigger:'axis',
|
|
|
axisPointer:{
|
|
|
type: 'shadow'
|
|
|
},
|
|
|
extraCssText:'width:160px;height:240px;',
|
|
|
position:['250','50'],
|
|
|
extraCssText:'width:160px;height:90px;'
|
|
|
},
|
|
|
legend: {
|
|
|
data: ['访问次数', '访问人数'],
|
|
|
textStyle:{
|
|
|
color:'#fff'
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
left: '3%',
|
|
|
right: '4%',
|
|
|
bottom: '3%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
}
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#547dc2',
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
yAxis:{
|
|
|
type: 'category',
|
|
|
data:dateList,
|
|
|
inverse:true,
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2',
|
|
|
},
|
|
|
margin:20
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#547dc2',
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
name: '访问次数',
|
|
|
type: 'bar',
|
|
|
stack: '总量',
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: true,
|
|
|
position: 'insideRight'
|
|
|
}
|
|
|
},
|
|
|
data: countLis
|
|
|
},
|
|
|
{
|
|
|
name: '访问人数',
|
|
|
type: 'bar',
|
|
|
stack: '总量',
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: true,
|
|
|
position: 'insideRight'
|
|
|
}
|
|
|
},
|
|
|
data: personLis
|
|
|
}
|
|
|
]
|
|
|
},true)
|
|
|
|
|
|
|
|
|
// 定时更新
|
|
|
setInterval(function () {
|
|
|
var accessCountLis=getFewDaysAgoAccessCountByCityId();
|
|
|
var personLis=[];
|
|
|
var countLis=[];
|
|
|
var dateList=[];
|
|
|
for (var i=0;i<accessCountLis.length;i++) {
|
|
|
personLis.push(accessCountLis[i]['accessPerrsonCount']);
|
|
|
countLis.push(accessCountLis[i]['accessCount']);
|
|
|
dateList.push(accessCountLis[i]['date']);
|
|
|
}
|
|
|
var option2 = visit.getOption();
|
|
|
option2.yAxis.data=dateList;
|
|
|
option2.series[0].data=personLis;
|
|
|
option2.series[1].data=countLis;
|
|
|
visit.setOption(option2);
|
|
|
|
|
|
// 近3个月管理员访问日志
|
|
|
var option3=map_1.getOption();
|
|
|
var logsList=getLogsAggsPersonNameByCityId();
|
|
|
logsList.sort(function (a,b) {
|
|
|
return a.count-b.count;
|
|
|
})
|
|
|
var logs=[];
|
|
|
for (var i=0;i<10;i++) {
|
|
|
logs.push({
|
|
|
value:logsList[i].count, name:logsList[i]['person_name'].substr(0,logsList[i]['person_name'].length-3)
|
|
|
});
|
|
|
}
|
|
|
option3.series[0].data=logs;
|
|
|
map_1.setOption(option3);
|
|
|
|
|
|
|
|
|
},600000)
|
|
|
|
|
|
|
|
|
|
|
|
// middle-1 地图环形数据 map-1 近3个月管理员访问日志
|
|
|
function getLogsAggsPersonNameByCityId() {
|
|
|
var logsList;
|
|
|
$.ajax({
|
|
|
type:'GET',
|
|
|
async:false,
|
|
|
url:'/FengHuang/bigData/getLogsAggsPersonNameByCityId?city_id='+areaId,
|
|
|
dataType:'json',
|
|
|
success:function (data) {
|
|
|
logsList=data;
|
|
|
}
|
|
|
})
|
|
|
return logsList;
|
|
|
}
|
|
|
var logsList=getLogsAggsPersonNameByCityId();
|
|
|
// logsList.sort(function (a,b) {
|
|
|
// return a.count-b.count;
|
|
|
// })
|
|
|
var logs=[];
|
|
|
for (var i=0;i<10;i++) {
|
|
|
logsList[i]['person_name']=logsList[i]['person_name'].substr(0,logsList[i]['person_name'].length-3);
|
|
|
logs.push({
|
|
|
value:logsList[i].count, name:logsList[i]['person_name']
|
|
|
});
|
|
|
}
|
|
|
var map_1=echarts.init(document.getElementById('map_1'),'light');
|
|
|
// map_1.setOption({
|
|
|
// // title:{
|
|
|
// // text:'近3个月管理员访问日志',
|
|
|
// // textStyle:{
|
|
|
// // color:'#547dc2',
|
|
|
// // fontSize:'10'
|
|
|
// // }
|
|
|
// // },
|
|
|
// tooltip : {
|
|
|
// trigger: 'item',
|
|
|
// formatter: "{a} <br/>{b}管理员 : {c} ({d}%)"
|
|
|
// },
|
|
|
// series : [
|
|
|
// {
|
|
|
// name: '近3个月管理员访问日志',
|
|
|
// type: 'pie',
|
|
|
// radius : '55%',
|
|
|
// center: ['50%', '60%'],
|
|
|
// data:logs,
|
|
|
// label: {
|
|
|
// normal: {
|
|
|
// show : false
|
|
|
// }
|
|
|
// },
|
|
|
// itemStyle: {
|
|
|
// emphasis: {
|
|
|
// shadowBlur: 10,
|
|
|
// shadowOffsetX: 0,
|
|
|
// shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
// }
|
|
|
// }
|
|
|
// }
|
|
|
// ]
|
|
|
// },true)
|
|
|
map_1.setOption({
|
|
|
color: ['#85b6b2', '#6d4f8d', '#cd5e7e', '#e38980', '#f29e29', '#f7db88', '#ffdb6d'],
|
|
|
title: {
|
|
|
text: '访问日志',
|
|
|
x: 'center',
|
|
|
top: '30%',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize:12
|
|
|
}
|
|
|
},
|
|
|
series: [{
|
|
|
type: 'pie',
|
|
|
radius: ['50%', '70%'],
|
|
|
avoidLabelOverlap: false,
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
label: {
|
|
|
show: false
|
|
|
},
|
|
|
labelLine: {
|
|
|
show: false
|
|
|
},
|
|
|
shadowBlur: 40,
|
|
|
shadowColor: 'rgba(40, 40, 40,0.3)',
|
|
|
}
|
|
|
},
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: false,
|
|
|
position: 'center'
|
|
|
},
|
|
|
emphasis: {
|
|
|
show: true,
|
|
|
formatter: function(param) {
|
|
|
return param.name + '\n' + param.percent.toFixed(0) + '%';
|
|
|
},
|
|
|
textStyle: {
|
|
|
fontSize: '10',
|
|
|
color:'#fff'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
labelLine: {
|
|
|
normal: {
|
|
|
show: true
|
|
|
}
|
|
|
},
|
|
|
data: logs
|
|
|
}]
|
|
|
},true)
|
|
|
|
|
|
|
|
|
// middle-1 map-2 折线数据
|
|
|
var AreaLoginJsonStr=getFewDayAreaLoginCountByCityId();
|
|
|
function getFewDayAreaLoginCountByCityId() {
|
|
|
var jsonStr;
|
|
|
$.ajax({
|
|
|
type:'GET',
|
|
|
url:'/FengHuang/bigData/getFewDayAreaLoginCountByCityId?city_id='+areaId+'&day=7',
|
|
|
async:false,
|
|
|
dataType:'json',
|
|
|
success:function (data) {
|
|
|
if(data.success){
|
|
|
var dateList=[];
|
|
|
var areaList=[];
|
|
|
var countLis=[];
|
|
|
for (var i=0;i<data.list.length;i++){
|
|
|
dateList.push(data.list[i].date);
|
|
|
areaList.push(data.list[i].area);
|
|
|
}
|
|
|
// 朝阳区 二道区经开区农安县榆树市双阳区南关区德惠市高新区绿园区一汽区九台市莲花山宽城区净月开发区
|
|
|
var x1=[], x1=[],x2=[],x3=[],x4=[],x5=[],x6=[],x7=[],x8=[],x9=[],x10=[],x11=[], x12=[],x13=[],x14=[],x15=[];
|
|
|
console.log(areaList);
|
|
|
for (var i=0;i<areaList.length;i++){
|
|
|
x1.push(areaList[i][0].count);
|
|
|
x2.push(areaList[i][1].count);
|
|
|
x3.push(areaList[i][2].count);
|
|
|
x4.push(areaList[i][3].count);
|
|
|
x5.push(areaList[i][4].count);
|
|
|
x6.push(areaList[i][5].count);
|
|
|
x7.push(areaList[i][6].count);
|
|
|
x8.push(areaList[i][7].count);
|
|
|
x9.push(areaList[i][8].count);
|
|
|
x10.push(areaList[i][9].count);
|
|
|
x11.push(areaList[i][10].count);
|
|
|
x12.push(areaList[i][11].count);
|
|
|
x13.push(areaList[i][12].count);
|
|
|
x14.push(areaList[i][13].count);
|
|
|
x15.push(areaList[i][14].count);
|
|
|
}
|
|
|
jsonStr={
|
|
|
'date':dateList,
|
|
|
'x1':x1,
|
|
|
'x2':x2,
|
|
|
'x3':x3,
|
|
|
'x4':x4,
|
|
|
'x5':x5,
|
|
|
'x6':x6,
|
|
|
'x7':x7,
|
|
|
'x8':x8,
|
|
|
'x9':x9,
|
|
|
'x10':x10,
|
|
|
'x11':x11,
|
|
|
'x12':x12,
|
|
|
'x13':x13,
|
|
|
'x14':x14,
|
|
|
'x15':x15
|
|
|
|
|
|
};
|
|
|
// areaList.push({
|
|
|
// name:data.list[i]['area_name'],
|
|
|
// type:'line',
|
|
|
// stack: '总量',
|
|
|
// data:[120, 132, 101, 134, 90, 230, 210]
|
|
|
// })
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
return jsonStr;
|
|
|
}
|
|
|
var map_2=echarts.init(document.getElementById('map_2'),'light');
|
|
|
map_2.setOption({
|
|
|
tooltip : {
|
|
|
trigger: 'axis',
|
|
|
// formatter: "{a}访问总量",
|
|
|
position: ['50%', '30%']
|
|
|
},
|
|
|
grid: {
|
|
|
left: '3%',
|
|
|
right: '4%',
|
|
|
bottom: '3%',
|
|
|
top:'10%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
xAxis: {
|
|
|
type: 'category',
|
|
|
boundaryGap: false,
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
},
|
|
|
// interval:0,
|
|
|
// margin:10,
|
|
|
// rotate:35
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#547dc2',
|
|
|
}
|
|
|
},
|
|
|
data: AreaLoginJsonStr.date
|
|
|
},
|
|
|
yAxis: {
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: '#547dc2'
|
|
|
}
|
|
|
},
|
|
|
axisLine: {
|
|
|
lineStyle: {
|
|
|
color: '#547dc2',
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// 朝阳区 二道区经开区农安县榆树市双阳区南关区德惠市高新区绿园区一汽区九台市莲花山宽城区净月开发区
|
|
|
series: [
|
|
|
{
|
|
|
name:'德惠市',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x8
|
|
|
},
|
|
|
{
|
|
|
name:'农安县',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x4
|
|
|
},
|
|
|
{
|
|
|
name:'九台市',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x12
|
|
|
},
|
|
|
{
|
|
|
name:'宽城区',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x14
|
|
|
},
|
|
|
{
|
|
|
name:'二道区',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x2
|
|
|
},
|
|
|
{
|
|
|
name:'朝阳区',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x1
|
|
|
},
|
|
|
{
|
|
|
name:'绿园区',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x10
|
|
|
},
|
|
|
{
|
|
|
name:'南关区',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x7
|
|
|
},
|
|
|
{
|
|
|
name:'双阳区',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x6
|
|
|
},
|
|
|
{
|
|
|
name:'榆树市',
|
|
|
type:'line',
|
|
|
stack: '总量',
|
|
|
data:AreaLoginJsonStr.x5
|
|
|
}
|
|
|
]
|
|
|
},true)
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// right --3 第三方平台浏览人数 次数
|
|
|
$(function() {
|
|
|
var $this = $("#news");
|
|
|
var scrollTimer;
|
|
|
$this.hover(function() {
|
|
|
clearInterval(scrollTimer);
|
|
|
}, function() {
|
|
|
scrollTimer = setInterval(function() {
|
|
|
scrollNews($this);
|
|
|
}, 2000);
|
|
|
}).trigger("mouseleave");
|
|
|
|
|
|
function scrollNews(obj) {
|
|
|
var $self = obj.find("ul");
|
|
|
var lineHeight = $self.find("li:first").height();
|
|
|
$self.animate({
|
|
|
"marginTop": -lineHeight + "px"
|
|
|
}, 600, function() {
|
|
|
$self.css({
|
|
|
marginTop: 0
|
|
|
}).find("li:first").appendTo($self);
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
|
|
|
window.onresize = function () {
|
|
|
console.log(1);
|
|
|
// teastu.resize();
|
|
|
radar.resize();
|
|
|
stu.resize();
|
|
|
districtTeaStu.resize();
|
|
|
visit.resize();
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html> |
