You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
507 lines
24 KiB
507 lines
24 KiB
<!--
|
|
* @Description 文件描述
|
|
* @Author zhangming
|
|
* @Date 2021-03-12 14:16:23
|
|
* @LastEditTime 2021-04-08 08:22:12
|
|
* @LastEditors zhangming
|
|
-->
|
|
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>轮播图</title>
|
|
<link rel="stylesheet" href="css/comon0.css">
|
|
<link href="css/nav_sytle.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="./css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="./css/font-awesome.min.css">
|
|
<link rel="stylesheet" href="css/sidebar-menu.css">
|
|
|
|
<script src="js/jquery-2.1.1.min.js"></script>
|
|
<script src="js/utils.js"></script>
|
|
<script src="js/nav.js"></script>
|
|
<style>
|
|
.container {
|
|
width: 100%;
|
|
}
|
|
|
|
.Index iframe {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
</head>
|
|
<script>
|
|
$(window).load(function () {
|
|
$(".loading").fadeOut()
|
|
})
|
|
|
|
/****/
|
|
$(document).ready(function () {
|
|
var whei = $(window).width()
|
|
$("html").css({ fontSize: whei / 20 })
|
|
$(window).resize(function () {
|
|
var whei = $(window).width()
|
|
$("html").css({ fontSize: whei / 20 })
|
|
});
|
|
});
|
|
</script>
|
|
<script type="text/javascript" src="js/echarts.min.js"></script>
|
|
<script language="JavaScript" src="js/js.js"></script>
|
|
<script language="JavaScript" src="js/areaIndex.js"></script>
|
|
<script language="JavaScript" src="js/schoolIndex.js"></script>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<div class="Index" style="display: block;">
|
|
|
|
<div class="loading">
|
|
<div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
|
|
</div>
|
|
<div class="head">
|
|
<div class="con">
|
|
<div class="left" style="font-family:Comic Sans MS;font-size:14px;">
|
|
<i class="fa fa-dedent" style="font-size: 24px;"></i>
|
|
</div>
|
|
</div>
|
|
<!-- <a href="">
|
|
<i class="fa fa-bars"></i>
|
|
</a> -->
|
|
<h1>
|
|
湘潭市教育发展总体情况
|
|
</h1>
|
|
|
|
|
|
</div>
|
|
<div class="mainbox">
|
|
<ul class="clearfix">
|
|
<li>
|
|
<div>
|
|
<div class="boxall" style="height: 3.2rem;width: 49%;display: inline-block;">
|
|
<div class="alltitle">各阶段学校数量</div>
|
|
<div class="allnav" id="echart_school_number1"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
<div class="boxall" style="height: 3.2rem;width: 49%;float: right;">
|
|
<div class="alltitle">学校规模情况</div>
|
|
<div class="allnav" id="echart_school_size2"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</div>
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">办学条件情况</div>
|
|
<!-- <div class="allnav" id="echart3"></div> -->
|
|
<div class="allnav" id="echart_school_condition3"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="bar">
|
|
<div class="barbox2">
|
|
<ul class="clearfix">
|
|
<li class="pulll_left">
|
|
<p>学校总数</p>
|
|
<div id="schoolNumber" class="numberStyle"></div>
|
|
</li>
|
|
<li class="pulll_left">
|
|
<p>教职工总数</p>
|
|
<div id="teacherNumber" class="numberStyle"></div>
|
|
</li>
|
|
<li class="pulll_left">
|
|
<p>学生总数</p>
|
|
<div id="studentNumber" class="numberStyle"></div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="tab">
|
|
<button class="active tabbtn" id="cityMap">县市级地图</button>
|
|
<button class="tabbtn" id="otherMap">开发区地图</button>
|
|
</div>
|
|
|
|
<div class="map">
|
|
<div class="map1"><img src="picture/lbx.png"></div>
|
|
<div class="map2"><img src="picture/jt.png"></div>
|
|
<!-- <div class="map3"><img src="picture/map.png"></div> -->
|
|
<div class="map4" id="map_1"></div>
|
|
<!-- <div class="map4" id="map_2" style="display: none;"></div> -->
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">专任教师师生比</div>
|
|
<div class="sy" id="taacher_and_student1"></div>
|
|
<div class="sy" id="taacher_and_student2"></div>
|
|
<div class="sy" id="taacher_and_student3"></div>
|
|
</div>
|
|
<div class="boxall" style="height:3.2rem">
|
|
<div class="alltitle">城乡专任教师师生比</div>
|
|
<div class="allnav" id="city_taacher_and_student6"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<ul class="clearfix">
|
|
<li style="width: 30%;">
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">学生情况</div>
|
|
<div class="allnav" id="student_situation9"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 20%;">
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">班额情况</div>
|
|
<div class="tab" style="margin: 0.1rem auto;">
|
|
<button class="active tabbtn" id='BExiaoxue'>小学</button>
|
|
<button class="tabbtn" id='BEchuzhong'>初中</button>
|
|
<button class="tabbtn" id='BEgaozhong'>高中</button>
|
|
</div>
|
|
<div class="allnav" id="class_capacity10"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 20%;">
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">留守儿童情况</div>
|
|
<div class="allnav" id="left_behind_children11"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 30%;">
|
|
<div class="boxall" style="height:3.2rem">
|
|
<div class="alltitle">随迁子女情况</div>
|
|
<div class="tab" style="margin: 0.1rem auto">
|
|
<button class="active tabbtn" id='SQxiaoxue'>小学</button>
|
|
<button class="tabbtn" id='SQchuzhong'>初中</button>
|
|
<button class="tabbtn" id='SQgaozhong'>高中</button>
|
|
</div>
|
|
<div class="allnav" style="width: 40%; float: left;" id="echart8"></div>
|
|
<div class="allnav" style="width: 60%; float: left;" id="echart7"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="Index" style="display: none;">
|
|
|
|
<div class="loading">
|
|
<div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
|
|
</div>
|
|
<div class="head">
|
|
<div class="con">
|
|
<div class="left" style="font-family:Comic Sans MS;font-size:14px;">
|
|
<i class="fa fa-dedent" style="font-size: 24px;"></i>
|
|
</div>
|
|
</div>
|
|
<!-- <a href="">
|
|
<i class="fa fa-bars"></i>
|
|
</a> -->
|
|
<h1>
|
|
<!-- 南关区教育发展总体情况 -->
|
|
</h1>
|
|
<div class="goBack"><a href="index.html">返回</a></div>
|
|
|
|
</div>
|
|
<div class="mainbox">
|
|
<ul class="clearfix">
|
|
<li style="width: 25%;">
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">各阶段学校数量</div>
|
|
<div class="allnav" id="student_number_qx1"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">学校规模情况</div>
|
|
<div class="allnav" id="echart_school_size_qx2"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 50%;">
|
|
<div class="map">
|
|
<div class="map1_a"><img src="picture/lbx.png"></div>
|
|
<div class="map2_a"><img src="picture/jt.png"></div>
|
|
<div class="map5" id="map_3" style="left: -65%;"></div>
|
|
<div id="school_list" class="school_list">
|
|
<ul class="school_list_ul">
|
|
|
|
</ul>
|
|
</div>
|
|
<ul class="nav nav-pills">
|
|
</ul>
|
|
</div>
|
|
|
|
</li>
|
|
<li style="width: 25%;">
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">学生情况</div>
|
|
<div class="allnav" id="student_situation_qx3"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">班额情况</div>
|
|
<div class="tab" style="margin: 0.1rem auto;">
|
|
<button class="active tabbtn" id='BExiaoxue'>小学</button>
|
|
<button class="tabbtn" id='BEchuzhong'>初中</button>
|
|
<button class="tabbtn" id='BEgaozhong'>高中</button>
|
|
</div>
|
|
<div class="allnav" id="class_capacity_qx4"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
|
|
</li>
|
|
</ul>
|
|
<ul class="clearfix">
|
|
<li style="width: 30%;">
|
|
<div class="boxall" style="height: 3.2rem">
|
|
<div class="alltitle">办学条件情况</div>
|
|
<!-- <div class="allnav" id="echart3"></div> -->
|
|
<div class="allnav" id="echart_school_condition_qx5"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 40%;">
|
|
<div class="boxall" style="height:3.2rem">
|
|
<div class="alltitle">专任教师师生比</div>
|
|
<div class="sy" id="taacher_and_student_qx61"></div>
|
|
<div class="sy" id="taacher_and_student_qx62"></div>
|
|
<div class="sy" id="taacher_and_student_qx63"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 30%;">
|
|
<div class="boxall" style="height:3.2rem">
|
|
<div class="alltitle">学生男女比例</div>
|
|
<div class="sy" id="student_boys_and_girls11"></div>
|
|
<div class="sy" id="student_boys_and_girls12"></div>
|
|
<div class="sy" id="student_boys_and_girls13"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="Index" style="display: none;">
|
|
|
|
<div class="loading">
|
|
<div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
|
|
</div>
|
|
<div class="head">
|
|
<div class="con">
|
|
<div class="left" style="font-family:Comic Sans MS;font-size:14px;">
|
|
<i class="fa fa-dedent" style="font-size: 24px;"></i>
|
|
</div>
|
|
</div>
|
|
<h1> </h1>
|
|
<div class="goBack"></div>
|
|
</div>
|
|
<div class="mainbox">
|
|
<ul class="clearfix">
|
|
<li>
|
|
<div class="boxall" style="height: 3.13rem">
|
|
<div class="alltitle">学校概况</div>
|
|
<div class="school_profile">
|
|
<ul>
|
|
<li><span id="school_sponsor"></span></li>
|
|
<li><span id="school_type"></span></li>
|
|
<li><span id="school_principal"></span></li>
|
|
<li><span id="school_category"></span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="boxall" style="height: 3.13rem">
|
|
<div class="alltitle">学校办学条件</div>
|
|
<div class="allnav" id="echart1"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="boxall" style="height: 6.4rem">
|
|
<div class="alltitle">班级情况</div>
|
|
<div class="tab">
|
|
<button class="active tabbtn" id='BExiaoxue'>小学</button>
|
|
<button class="tabbtn" id='BEchuzhong'>初中</button>
|
|
<button class="tabbtn" id='BEgaozhong'>高中</button>
|
|
</div>
|
|
<div class="bar">
|
|
<div class="barbox2">
|
|
<ul class="clearfix">
|
|
<li class="pulll_left">
|
|
<p>学生数量</p>
|
|
<div id="studentNumber" class="numberStyle"></div>
|
|
</li>
|
|
<li class="pulll_left">
|
|
<p>班级数量</p>
|
|
<div id="classNumber" class="numberStyle"></div>
|
|
</li>
|
|
<li class="pulll_left">
|
|
<p>平均班额</p>
|
|
<div id="averageClassSize" class="numberStyle"></div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="allnav" id="echart2" style="height: 75%;"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
<li>
|
|
<div class="boxall" style="height: 6.4rem">
|
|
<div class="alltitle">师生男女比例</div>
|
|
<div class="boxall_background">
|
|
<div class="student_sex_ratio">
|
|
<div class="boy_img">
|
|
<img src="./images/学生-男.png" alt="">
|
|
<p>学生</p>
|
|
</div>
|
|
<div class="vs_css">VS</div>
|
|
<div class="girl_img">
|
|
<img src="./images/学生-女.png" alt="">
|
|
<p>学生</p>
|
|
</div>
|
|
</div>
|
|
<div class="allnav" id="echart4" style="height: calc(100% - 60px);"></div>
|
|
</div>
|
|
<div class="boxall_background">
|
|
<div class="teacher_sex_ratio">
|
|
<div class="boy_img">
|
|
<img src="./images/教师-男.png" alt="">
|
|
<p>教师</p>
|
|
</div>
|
|
<div class="vs_css">VS</div>
|
|
<div class="girl_img">
|
|
<img src="./images/教师-女.png" alt="">
|
|
<p>教师</p>
|
|
</div>
|
|
</div>
|
|
<div class="allnav" id="echart6" style="height: calc(100% - 60px);"></div>
|
|
</div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
|
|
</li>
|
|
</ul>
|
|
<ul class="clearfix">
|
|
<li style="width: 30%;">
|
|
<div class="boxall" style="height: 3.13rem">
|
|
<div class="alltitle">教师学历分布</div>
|
|
<div class="allnav" id="echart5"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 40%;">
|
|
<div class="boxall" style="height:3.13rem">
|
|
<div class="alltitle">师生情况</div>
|
|
<div class="teacher_vs_student">
|
|
<div class="teacher_img_css"> <img src="./images/教师-女.png" alt="">教师</div>
|
|
<p>VS</p>
|
|
<div class="teacher_img_css"> <img src="./images/学生-男.png" alt="">学生</div>
|
|
</div>
|
|
<div class="pie_css" id="echart11"></div>
|
|
<div class="pie_css" id="echart12"></div>
|
|
<div class="pie_css" id="echart13"></div>
|
|
<div class="situation">
|
|
<ul>
|
|
<li id="student_num" style="text-align: right;"></li>
|
|
<li id="teacher_num" style="text-align: right;"></li>
|
|
<li id="full_time_num" style="text-align: right;"></li>
|
|
</ul>
|
|
</div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
<li style="width: 30%;">
|
|
<div class="boxall" style="height:3.13rem">
|
|
<div class="alltitle">学生情况</div>
|
|
<div class="allnav" id="echart3"></div>
|
|
<div class="boxfoot"></div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="back"></div>
|
|
<div class="bgDiv"></div>
|
|
|
|
<!-- <div class="Index">
|
|
<iframe src="index.html" frameborder="0"></iframe>
|
|
</div>
|
|
<div class="Index"> <iframe src="areaIndex.html" frameborder="0"></iframe></div>
|
|
<div class="Index"> <iframe src="schoolIndex.html" frameborder="0"></iframe></div> -->
|
|
</div>
|
|
<script>
|
|
// $(function () {
|
|
// var i = 0;
|
|
// $(".Index").eq(0).show().siblings().hide();
|
|
// setInterval(function () {
|
|
// i++;
|
|
// if (i == 3) {
|
|
// i = 0;
|
|
// }
|
|
// $(".Index").eq(i).show().siblings().hide();
|
|
// }, 5000);
|
|
// });
|
|
</script>
|
|
<!-- 市地图 -->
|
|
<script type="text/javascript" src="js/china.js"></script>
|
|
<script type="text/javascript" src="js/china2.js"></script>
|
|
<script type="text/javascript" src="js/area_echarts.js"></script>
|
|
<!-- 县区地图 -->
|
|
<script type="text/javascript" src="js/nanguan.js"></script>
|
|
<script type="text/javascript" src="js/area_echarts_nanguan.js"></script>
|
|
<script src="./js/sidebar-menu.js"></script>
|
|
<script src="js/jquery.timers-1.2.js"></script>
|
|
<script>
|
|
$.sidebarMenu($('.sidebar-menu'));
|
|
|
|
var index = 1;
|
|
$('body').everyTime('30s', function () {
|
|
$(".Index").eq(index).show().siblings().hide();
|
|
index++;
|
|
if (index === 3) {
|
|
index = 0;
|
|
};
|
|
E_chart.map((item, index) => {
|
|
var opt = E_chart[index].getOption();
|
|
E_chart[index].clear();
|
|
E_chart[index].setOption(opt)
|
|
});
|
|
E_chart_area.map((item, index) => {
|
|
var opt = E_chart_area[index].getOption();
|
|
E_chart_area[index].clear();
|
|
E_chart_area[index].setOption(opt)
|
|
});
|
|
E_chart_school.map((item, index) => {
|
|
var opt = E_chart_school[index].getOption();
|
|
E_chart_school[index].clear();
|
|
E_chart_school[index].setOption(opt)
|
|
});
|
|
});
|
|
|
|
// $('body').everyTime('30s', function () {
|
|
// E_chart.map((item, index) => {
|
|
// var opt = E_chart[index].getOption();
|
|
// E_chart[index].clear();
|
|
// E_chart[index].setOption(opt)
|
|
// });
|
|
// });
|
|
// // 县区
|
|
// $('body').everyTime('30s', function () {
|
|
// E_chart_area.map((item, index) => {
|
|
// var opt = E_chart_area[index].getOption();
|
|
// E_chart_area[index].clear();
|
|
// E_chart_area[index].setOption(opt)
|
|
// });
|
|
// });
|
|
// // 乡村
|
|
// $('body').everyTime('30s', function () {
|
|
// E_chart_school.map((item, index) => {
|
|
// var opt = E_chart_school[index].getOption();
|
|
// E_chart_school[index].clear();
|
|
// E_chart_school[index].setOption(opt)
|
|
// });
|
|
// });
|
|
</script>
|
|
</body>
|
|
|
|
</html> |