<!DOCTYPE html>
<!--青岛研锦网络科技有限公司版权所有-->
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
<title>建筑智慧工地管控</title>
<link rel="stylesheet" href="css/app.css" />
<script type="text/javascript" src="js/echarts.min.js"></script>
<script type="text/javascript" src="js/jdjh.js"></script>
<script type="text/javascript">
function getCurDate() {
var d = new Date();
var week;
switch (d.getDay()) {
case 1:
week = "星期一";
break;
case 2:
week = "星期二";
break;
case 3:
week = "星期三";
break;
case 4:
week = "星期四";
break;
case 5:
week = "星期五";
break;
case 6:
week = "星期六";
break;
default:
week = "星期天";
}
var years = d.getFullYear();
var month = add_zero(d.getMonth() + 1);
var days = add_zero(d.getDate());
var hours = add_zero(d.getHours());
var minutes = add_zero(d.getMinutes());
var seconds = add_zero(d.getSeconds());
var ndate = years + "年" + month + "月" + days + "日 " + hours + ":"
+ minutes + ":" + seconds + " " + week;
var divT = document.getElementById("logInfo");
divT.innerHTML = ndate;
}
function add_zero(temp) {
if (temp < 10)
return "0" + temp;
else
return temp;
}
setInterval("getCurDate()", 100);
</script>
</head>
<body class="bg01">
<div class="header">
<h1 class="header-title">建筑智慧工地管控</h1>
<div id="logInfo" style="text-align: left;color: #fff;position: relative;left: 10px;"><script type="text/JavaScript" language="JavaScript">
getCurDate();
</script></div>
</div>
<div class="wrapper">
<div class="content">
<div class="col col-l">
<div class="xpanel-wrapper xpanel-wrapper-55">
<div class="xpanel xpanel-l-t">
<div class="title">项目概况</div>
<div class="bcontent">
<ul>
<li class="leftrt">工程名称：</li>
<li class="rightrt">新建工程</li>
<li class="leftrt">工程类型：</li>
<li class="rightrt">水电</li>
<li class="leftrt">工程状态：</li>
<li class="rightrt">正在施工</li>
<li class="leftrt">业主单位：</li>
<li class="rightrt">项目管理中心</li>
<li class="leftrt">施工单位：</li>
<li class="rightrt">输变电分公司</li>
<li class="leftrt">建管单位：</li>
<li class="rightrt">建设部</li>
<li class="leftrt">监理单位：</li>
<li class="rightrt">**监理有限公司</li>
<li class="leftrt">计划开始时间：</li>
<li class="rightrt">2019-10-21</li>
<li class="leftrt">计划完成时间：</li>
<li class="rightrt">2019-10-21</li>
<li class="leftrt">实际开始时间：</li>
<li class="rightrt">2019-10-21</li>
<li class="leftrt">实际完成时间：</li>
<li class="rightrt">2019-10-21</li>
</ul>
</div>
</div>
</div>
<div class="xpanel-wrapper xpanel-wrapper-45">
<div class="xpanel xpanel-l-b">
<div class="title">项目人员出勤率</div>
<div id ="ryCharts" class="bcontent">
</div>
</div>
</div>
</div>
<div class="col col-c">
<div class="xpanel-wrapper xpanel-wrapper-55">
<div class="xpanel xpanel-c-b">
<div class="title title-long" style="padding-left:25px">项目进度甘特图</div>
<div id="gCharts" class="bcontent" style="height:92%;">
</div>
</div>
</div>
<div class="xpanel-wrapper xpanel-wrapper-45">
<div class="xpanel xpanel-c-b">
<div class="title title-long" style="padding-left:25px">双代号时标网络图</div>
<div id="container" class="bcontent" style="height:85%;">
</div>
</div>
</div>
</div>
<div class="col col-r">
<div class="xpanel-wrapper xpanel-wrapper-25" >
<div class="xpanel xpanel-r-t">
<div class="title">机具管控出勤率</div>
<div id="jqCharts" class="bcontent">
</div>
</div>
</div>
<div class="xpanel-wrapper xpanel-wrapper-25" >
<div class="xpanel xpanel-r-m">
<div class="title">违章情况分析率</div>
<div id="wzCharts" class="bcontent">
</div>
</div>
</div>
<div class="xpanel-wrapper xpanel-wrapper-45" >
<div class="xpanel xpanel-r-b">
<div class="title">物料验收</div>
<div id="wlCharts" class="bcontent">
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript">
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
title: {
text: '双代号时标网络图',
show: false
},
tooltip: {},
animationDurationUpdate: 1500,
animationEasingUpdate: 'quinticInOut',
color:['#ca8622', '#bda29a','#8B0000'],
series : [
{
type: 'graph',
layout: 'none',
symbolSize: 45,
roam: false, //放大缩小
label: {
normal: {
show: true,
textStyle: {
color: "#fff",
fontSize: 12,
}
}
},
edgeSymbol: ['circle', 'arrow'],
edgeSymbolSize: [4, 10],
edgeLabel: {
normal: {
show: true,
textStyle: {
fontSize: 12
},
formatter: "{c}"
}
},
data: [{
name: '节点1',
x: 50,
y: 300
}, {
name: '节点2',
x: 100,
y: 400
}, {
name: '节点3',
x: 100,
y: 200
}, {
name: '节点4',
x: 200,
y: 300
}, {
name: '节点5',
x: 300,
y: 400
}, {
name: '节点6',
x: 300,
y: 300
}, {
name: '节点7',
x: 300,
y: 200
}, {
name: '节点8',
x: 400,
y: 400
}, {
name: '节点9',
x: 450,
y: 200
}, {
name: '节点10',
x: 450,
y: 300
}, {
name: '节点11',
x: 550,
y: 400
}, {
name: '节点12',
x: 550,
y: 300
}, {
name: '节点13',
x: 650,
y: 200
},{
name: '节点14',
x: 650,
y: 300
}],
// links: [],
links: [{
source: 0,
target: 1,
value: 'C',
label: {
normal: {
show: true
}
}
}, {
source: 0,
target: 2,
value: 'A'
}, {
source: 0,
target: 3,
value: 'B',
lineStyle: {
normal: {
width: 4,
curveness: 0,
color: "#ff4747"
数据可视化智慧工地大屏页面.rar
需积分: 50 163 浏览量
2021-03-18
17:00:17
上传
评论 8
收藏 2.01MB RAR 举报
智慧工地大屏.rar （14个子文件） 
9 js 
echarts.min.js 455KB jdjh.js 18KB css app.css.bak 4KB app.css 4KB
index.html 27KB img 
bg02.png 565KB bg03.png 331KB title-bg-long.png 41KB panel.png 23KB header.png 97KB title-bg.png 30KB
loading.gif 108KB bg04.png 285KB bg01.png 460KB
评论0