|
|
|
|
|
<!doctype html>
|
|
|
|
|
|
<html>
|
|
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
|
<title>index</title>
|
|
|
|
|
|
<script type="text/javascript" src="js/jquery.js"></script>
|
|
|
|
|
|
<link rel="stylesheet" href="css/comon0.css">
|
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
|
<div class="loading">
|
|
|
|
|
|
<div class="loadbox"> <img src="images/loading.gif"> 页面加载中... </div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="head">
|
|
|
|
|
|
<h1>大数据可视化系统数据分析通用模版</h1>
|
|
|
|
|
|
<div class="time" id="showTime">2019/11/29 0:12:42</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mainbox">
|
|
|
|
|
|
<ul class="clearfix">
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<div class="boxall" style="height: calc(40% - .15rem)">
|
|
|
|
|
|
<div class="alltitle">模块标题 </div>
|
|
|
|
|
|
<div class="sycm">
|
|
|
|
|
|
<ul class="clearfix">
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1824</h2>
|
|
|
|
|
|
<span>华东地区</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1920</h2>
|
|
|
|
|
|
<span>华西地区</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>19%</h2>
|
|
|
|
|
|
<span>华南地区</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1824</h2>
|
|
|
|
|
|
<span>华北地区</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxfoot"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxall" style="height: calc(60% - .15rem)">
|
|
|
|
|
|
<div class="alltitle">模块标题</div>
|
|
|
|
|
|
<div class="sycm sycm2">
|
|
|
|
|
|
<ul class="clearfix">
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1824</h2>
|
|
|
|
|
|
<span>字段名称</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1920</h2>
|
|
|
|
|
|
<span>字段名称</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>19%</h2>
|
|
|
|
|
|
<span>字段名称</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1824</h2>
|
|
|
|
|
|
<span>字段名称</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>19%</h2>
|
|
|
|
|
|
<span>字段名称</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<h2>1824</h2>
|
|
|
|
|
|
<span>字段名称</span>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxfoot"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<div style="position: relative">
|
|
|
|
|
|
<div class="barnav">
|
|
|
|
|
|
<div class="bar">
|
|
|
|
|
|
<div class="barbox">
|
|
|
|
|
|
<ul class="clearfix">
|
|
|
|
|
|
<li class="pulll_left ">1942</li>
|
|
|
|
|
|
<li class="pulll_left counter">98612</li>
|
|
|
|
|
|
<li class="pulll_left counter">2091</li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="barbox2">
|
|
|
|
|
|
<ul class="clearfix">
|
|
|
|
|
|
<li class="pulll_left">字段名称</li>
|
|
|
|
|
|
<li class="pulll_left">字段名称</li>
|
|
|
|
|
|
<li class="pulll_left">字段名称</li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="mapbox">
|
|
|
|
|
|
<div class="map">
|
|
|
|
|
|
<div class="map1"><img src="images/lbx.png"></div>
|
|
|
|
|
|
<div class="map2"><img src="images/jt.png"></div>
|
|
|
|
|
|
<div class="map3"><img src="images/map.png"></div>
|
|
|
|
|
|
<div class="map4" id="map_1"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="boxall" style="height: calc(50% - .15rem)">
|
|
|
|
|
|
<div class="alltitle">
|
|
|
|
|
|
字段名称 <div class="pulll_right">
|
|
|
|
|
|
<a href="#"><span></span>已维修</a>
|
|
|
|
|
|
<a href="#"><span></span>未维修</a>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxnav" id="echart3"></div>
|
|
|
|
|
|
<div class="boxfoot"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxall" style="height: calc(50% - .15rem)">
|
|
|
|
|
|
<div class="alltitle">字段名称</div>
|
|
|
|
|
|
<div class="wrap boxnav">
|
|
|
|
|
|
<ul>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<p><span>深圳腾讯科技有限公司</span><span>门禁系统</span><span>在线</span></p>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<p><span>网易科技有限公司</span><span>防火系统</span><span>在线</span></p>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<p><span>百度科技有限公司</span><span>防火系统</span><span>在线</span></p>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<p><span>汽车之家科技有限公司</span><span>定位系统</span><span>在线</span></p>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<p><span>小米科技有限公司</span><span>定位系统</span><span>在线</span></p>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxfoot"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
<div class="copyright">版权所有：深圳市深海时代网络科技有限公司 粤ICP备15031517号-4</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="mainbox2">
|
|
|
|
|
|
<ul class="clearfix">
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<div class="boxall" style="height: 100%">
|
|
|
|
|
|
<div class="alltitle">
|
|
|
|
|
|
模块标题
|
|
|
|
|
|
<div class="pulll_right">
|
|
|
|
|
|
<a href="#"><span></span>已检点</a>
|
|
|
|
|
|
<a href="#"><span></span>未检点</a>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxnav">
|
|
|
|
|
|
<ul class="btbox">
|
|
|
|
|
|
<li id="bt01"></li>
|
|
|
|
|
|
<li id="bt02"></li>
|
|
|
|
|
|
<li id="bt03"></li>
|
|
|
|
|
|
<li id="bt04"></li>
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxfoot"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
|
<li>
|
|
|
|
|
|
<div class="boxall" style="height:100%">
|
|
|
|
|
|
<div class="alltitle">
|
|
|
|
|
|
模块标题
|
|
|
|
|
|
<div class="pulll_right sebtn">
|
|
|
|
|
|
<a href="#" class="active">近七天</a>
|
|
|
|
|
|
<a href="#">近30天</a>
|
|
|
|
|
|
<a href="#">12月</a>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="boxnav" id="echart4"></div>
|
|
|
|
|
|
<div class="boxfoot"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<script language="JavaScript" src="js/js.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="js/echarts.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="js/china.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="js/area_echarts.js"></script>
|
|
|
|
|
|
<script src="js/jquery.liMarquee.js"></script>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
$('.counter').countUp();
|
|
|
|
|
|
$(function () {
|
|
|
|
|
|
$('.wrap,.adduser').liMarquee({
|
|
|
|
|
|
direction: 'up',//身上滚动
|
|
|
|
|
|
runshort: false,//内容不足时不滚动
|
|
|
|
|
|
scrollamount: 20//速度
|
|
|
|
|
|
});
|
|
|
|
|
|
});
|
|
|
|
|
|
var t = null;
|
|
|
|
|
|
t = setTimeout(time, 1000);//開始运行
|
|
|
|
|
|
function time() {
|
|
|
|
|
|
clearTimeout(t);//清除定时器
|
|
|
|
|
|
dt = new Date();
|
|
|
|
|
|
var y = dt.getFullYear();
|
|
|
|
|
|
var mt = dt.getMonth() + 1;
|
|
|
|
|
|
var day = dt.getDate();
|
|
|
|
|
|
var h = dt.getHours();//获取时
|
|
|
|
|
|
var m = dt.getMinutes();//获取分
|
|
|
|
|
|
var s = dt.getSeconds();//获取秒
|
|
|
|
|
|
var t = null;
|
|
|
|
|
|
document.getElementById("showTime").innerHTML = y + "/" + Appendzero(mt) + "/" + Appendzero(day) + " " + Appendzero(h) + ":" + Appendzero(m) + ":" + Appendzero(s) + "";
|
|
|
|
|
|
function Appendzero(obj) {
|
|
|
|
|
|
if (obj < 10) return "0" + "" + obj;
|
|
|
|
|
|
else return obj;
|
|
|
|
|
|
}
|
|
|
|
|
|
t = setTimeout(time, 1000); //设定定时器，循环运行
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
|
|
</html>
|
