<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>消防监控</title>
<script type="text/javascript" src="js/jquery.js"></script>
<link rel="stylesheet" href="css/comon0.css">
<style>
.grid {
margin-top:5%;
width:80%;
height: 10px;
display: grid;
grid-template-columns: repeat(20, 1fr);
grid-column-gap: 14px;
}
.line {
position: relative;
width: 90%;
height: 7px;
}
.line::before, .line::after {
content: '';
position: absolute;
width: 4.5rem;
height: 100%;
border-radius: 7px;
background-color: #FF0000;
}
.line::before {
animation: first-line ease-in-out 4s var(--delay) infinite alternate;
}
.line::after {
bottom: 0;
background-color: #B22222;
width: calc(80% - 10px);
animation: second-line ease-in-out 4s var(--delay) infinite alternate;
}
.line:nth-child(1) {
--delay: calc(-0.1s);
}
@keyframes first-line {
70% {
width: calc(80% - 10px);
}
100% {
background-color: #FF0000;
}
}
}
</style>
</head>
<script type="text/javascript">
$(document).ready(function(){
var html=$(".wrap ul").html()
$(".wrap ul").append(html)
var ls=$(".wrap li").length/2+1
i=0
ref = setInterval(function(){
i++
if(i==ls){
i=1
$(".wrap ul").css({marginTop:0})
$(".wrap ul").animate({marginTop:-'.52'*i+'rem'},1000)
}
$(".wrap ul").animate({marginTop:-'.52'*i+'rem'},1000)
},2400);
var html2=$(".adduser ul").html()
$(".adduser ul").append(html2)
var ls2=$(".adduser li").length/2+1
a=0
ref = setInterval(function(){
a++
if(a==ls2){
a=1
$(".adduser ul").css({marginTop:0})
$(".adduser ul").animate({marginTop:-'.5'*a+'rem'},800)
}
$(".adduser ul").animate({marginTop:-'.5'*a+'rem'},800)
},4300);
})
</script>
<body style='overflow:-Scroll;overflow-y:hidden'>
<div class="loading">
<div class="loadbox"> <img src="images/loading.gif"> 页面加载中... </div>
</div>
<div class="head">
<h1>翼兴消防监控</h1>
<div class="weather"><span id="showTime"></span></div>
<script>
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();
document.getElementById("showTime").innerHTML = y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" + s + "秒";
t = setTimeout(time, 1000);
}
</script>
</div>
<div class="mainbox">
<ul class="clearfix">
<li>
<div class="boxall" style="height: 5.2rem">
<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>5%</h2><span>环比增长</span></li>
</ul>
<div style="border-bottom: 1px solid rgba(255,255,255,.1)"></div>
<ul class="clearfix">
<li><h2>824</h2><span>主机(20001)</span></li>
<li><h2>710</h2><span>主机(20003)</span></li>
<li><h2>200</h2><span>主机(20002)</span></li>
</ul>
</div>
<div class="addnew" >
<div class="tit02"><span>误报种类</span></div>
<div class="allnav" style="height: 2.2rem" id="wbzl"></div>
</div>
<div class="boxfoot"></div>
</div>
<div class="boxall" style="height: 4.9rem">
<div class="alltitle">无线烟感报警</div>
<div class="allnav" style="height: 1.5rem" id="wxyg"></div>
<div class="addnew" >
<div class="tit02"><span>误报种类</span></div>
<div class="allnav" style="height: 2.0rem" id="wwbzl"></div>
</div>
<div class="boxfoot"></div>
</div>
</li>
<li>
<div class="bar">
<div class="barbox ">
<ul class="clearfix">
<li class="pulll_left counter">
6069
</li>
<li class="pulll_left counter">410</li>
</ul>
</div>
<div class="barbox2">
<ul class="clearfix">
<li class="pulll_left">联网单位数量</li>
<li class="pulll_left">联网消防主机数量</li>
</ul>
</div>
</div>
<div class="bar">
<div class="barbox">
<ul class="clearfix">
<li class="pulll_left counter">81189</li>
<li class="pulll_left counter">39410</li>
</ul>
</div>
<div class="barbox2">
<ul class="clearfix">
<li class="pulll_left">总点位数量</li>
<li class="pulll_left">总报警数量</li>
</ul>
</div>
</div>
<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 class="boxall" style="height: 3.4rem">
<div class="alltitle">电报警</div>
<div class="allnav" id="dbj" style="width:7.2rem;height:3rem;margin-top: 0.3rem"></div>
<div class="boxfoot"></div>
</div>
</li>
<li>
<div class="boxall" style="height:5.2rem">
<div class="alltitle">燃气报警</div>
<div class="clearfix">
<div class="sy" style="width:300px;" id="yqbj"></div>
</div>
<div class="addnew" >
<div class="tit02"><span>最新报警</span></div>
<div class="adduser" style="height: 2.0rem">
<ul >
<li class="clearfix"> <span class="pulll_left">大连市XX医院</span> <span class="pulll_right">一楼 - 吸烟 - 2019-10-11 09:58:58 </span> </li>
<li class="clearfix"> <span class="pulll_left">大连市XX集团</span> <span class="pulll_right">二楼 - 误报 - 2019-10-11 09:58:58 </span> </li>
<li class="clearfix"> <span class="pulll_left">开发区医院</span> <span class="pulll_right">三楼 - 粉尘 - 2019-10-11 09:58:58 </span> </li>
<li class="clearfix"> <span class="pulll_left">时代广场</span> <span class="pulll_right">四楼 - 误报 - 2019-10-11 09:58:58 </span> </li>
<li class="clearfix"> <span class="pulll_left">海昌物业</span> <span class="pulll_right">四楼 - 误报 - 2019-10-11 09:58:58 </span> </li>
<li class="clearfix"> <span class="pulll_left">海昌物业</span> <span class="pulll_right">四楼 - 误报 - 2019-10-11 09:58:58 </span> </li>
基于ECharts消防监控可视化大屏源码.rar （42个子文件） 
基于ECharts消防监控可视化大屏源码 js 
echarts.simple.js 1.23MB jquery.countup.min.js 1KB echarts-tool1.js 74KB echarts-tool.js 62KB jquery.waypoints.min.js 9KB echarts.simple.min.js 305KB common.js.bak 61KB echarts.common.min.js 471KB echarts-gl.js 1.86MB echarts.blank.js 888B echarts.common.js 1.84MB common.js 117KB echarts.all.js 6KB timelineOption.js 16KB echarts.js 2.84MB china.js 117KB echarts.js.map 5.03MB echarts.min.js 744KB area_echarts.js 11KB echarts-tool.js.bak 74KB echarts-gl.min.js 672KB jquery.js 82KB css comon0.css.bak 8KB comon0.css 8KB
index.html 9KB images 
weather.png 2KB bg02big2index.png 1KB jt.png 72KB lbx.png 81KB
loading.gif 701B logo.png 6KB bg03bigindex.png 1KB line.png 4KB jzxz2.png 4KB
bg.jpg 252KB bg04bigindex.png 1021B head.jpg 3KB head_bg.png 8KB jzxz1.png 4KB bg02bigindex_.png 3KB map.png 302KB bg02bigindex.png 1KB资源评论
2301_787923302024-12-24感谢大佬，让我及时解决了当下的问题，解燃眉之急，必须支持！
五星资源
- 粉丝: 7269
- 资源: 5204
最新资源
- 服装销售平台源代码.zip
- 高校心理教育辅导设计与实现.zip
- 服装生产管理系统源代码.zip
- 3b123中学生日常行为评分管理系统_springboot+vue.zip
- 3b125流浪狗领养管理_springboot+vue.zip
- 3b124电影推荐系统_springboot+vue.zip
- 购物推荐网站源代码.zip
- 技术交流和分享平台源代码.zip
- 基于B2B平台的医疗病历交互系统源代码.zip
- 3b127旅游网站设计_springboot+vue0.zip
- 3b126小说网站系统_springboot+vue.zip
- 教师工作量管理系统源代码.zip
- 俱乐部管理系统源代码.zip
- 兼职网源代码.zip
- 美容院管理系统源代码.zip
- 旅游网站源代码.zip
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
