党建云图修改

src/main/webapp/static/web/djyt/images/ja_dj.css

@@ -395,17 +395,37 @@ c img {
 }
 
 /**************************************通用样式结束*******************************************/
+
+.bj{
+	background:url(map-bj.png) no-repeat center 100%;
+	background-size:100% 100%;
+	position:fixed;
+	left:0;
+	top:0;
+	width:100%;
+	height:100%;}
+
 .map{
-	position: fixed;
-	z-index: 0;
-	top:0px;
-	left: 0px;
+	width: 850px;
+    height: 770px;
+	margin:3% auto;
+	padding:60px 0 0 0;
+	position:relative;
+	z-index:1;
 }
+.map-bj{
+	background:url(ditu.png) no-repeat;
+	background-size:100% 100%;
+	width: 850px;
+    height: 770px;}
+
 .header{
 	width: 100%;
 	    margin: 0px;
 	    height: 45px;
 	    position: fixed;
+		left:0;
+		top:0;
 	    z-index: 10;
 	    background: url(header_bg.png) no-repeat center;
 }
@@ -427,163 +447,116 @@ c img {
 	line-height: 39px;
 	letter-spacing: 1px;
 }
-.map_tk{
+.map_div{
 	background: url(tkbg.png) no-repeat center;
-	width: 358px;
-	height: 226px;
-	color: #fff;
-	position: absolute;
-	z-index: 9;
-	padding: 33px 35px;
-	display: none;
+	width: 283px;
+    height: 165px;
+    color: #fff;
+    z-index: 99;
+    padding: 29px 46px 29px 26px;
+	position:absolute;
 }
-.map_tk h2{
+.map_div h2{
 	font-size: 18px;
 	font-weight: 900;
 	height: 35px;
 	line-height: 35px;
 }
-.map_tk p{
+.map_div p{
 	font-size: 14px;
 	line-height: 20px;
 }
-#tdj{
-	position:absolute;
-	width:160px;
-	height:95px;
-	cursor:pointer;
-	top:74px;
-	left:709px;
-	z-index:1;
-}
-#qhz{
-	position: absolute;
-	width: 160px;
-	height: 95px;
-	cursor: pointer;
-	top: 154px;
-	left: 750px;
-	z-index: 1;
-}
-#cyz{
-	position: absolute;
-	width: 160px;
-	height: 95px;
-	cursor: pointer;
-	top: 268px;
-	left: 584px;
-	z-index: 1;
-}
-#hdz{
-	position: absolute;
-	width: 121px;
-	height: 77px;
-	cursor: pointer;
-	top: 335px;
-	left: 656px;
-	z-index: 1;
-}
-#tsz{
-	position: absolute;
-	width: 121px;
-	height: 77px;
-	cursor: pointer;
-	top: 295px;
-	left: 711px;
-	z-index: 1;
-}
-#dlz{
-	position: absolute;
-	width: 141px;
-	height: 100px;
-	cursor: pointer;
-	bottom: 131px;
-	left: 649px;
-	z-index: 1;
-}
-#ylz{
-	position: absolute;
-	width: 115px;
-	height: 72px;
-	cursor: pointer;
-	bottom: 169px;
-	left: 775px;
-	z-index: 1;
-}
-#lsx{
-	position: absolute;
-	width: 115px;
-	height: 72px;
-	cursor: pointer;
-	bottom: 75px;
-	left: 735px;
-	z-index: 1;
-}
-#jas{
-	position: absolute;
-	width: 115px;
-	height: 72px;
-	cursor: pointer;
-	bottom: 283px;
-	right: 613px;
-	z-index: 1;
-}
-#twz{
-	position: absolute;
-	width: 63px;
-	height: 45px;
-	cursor: pointer;
-	bottom: 369px;
-	right: 577px;
-	z-index: 1;
-}
-.tdj{
-	top: -46px;
-	    left: -281px;
-}
-.qhz{
-	top: -71px;
-	left: -269px;
-}
-.cyz{
-	top: -52px;
-	left: -287px;
-}
-.hdz{
-	    top: -70px;
-	    left: -288px;
-}
-.tsz{
-	    top: -76px;
-	    left: -298px;
-}
-.dlz{
-	    bottom: -86px;
-	    left: -281px;
-	    top: auto;
-}
-.ylz{
-	    bottom: 231px;
-	    left: 902px;
-}
-.lsx{
-	    bottom: -70px;
-	    left: -309px;
-	    top: auto;
-}
-.jas{
-	    bottom: -88px;
-	    right: 21px;
-	    top: auto;
-	    left: auto;
-}
-.twz{
-	    bottom: -94px;
-	    right: 2px;
-	    top: auto;
-	    left: auto;
-}
 
+.zuobiao{
+	 background:url(zuobiao.png) no-repeat;
+	 background-size:100% 100%;
+	 width: 38px;
+    height: 35px;
+	 position:absolute;
+	 z-index:2;
+	 display:block;
+	 }
+.xz1{
+	left: 173px;
+    bottom: 143px;
+	}
+.xz-name1{
+	left: -341px;
+    bottom: -91px;
+	display:none;}
+
+.xz1:hover .xz-name1{ display:block;}
+
+.xz2{
+	left: 246px;
+    bottom: 73px;
+	}
+
+.xz2:hover .xz-name1{ display:block;}
+.xz3{
+	left: 316px;
+    bottom: 137px;
+	}
+
+.xz3:hover .xz-name1{ display:block;}
+.xz4{
+	 left: 157px;
+    top: 241px;
+	}
+
+.xz4:hover .xz-name1{ display:block;}
+.xz5{
+	left: 164px;
+    top: 335px;
+	}
+
+.xz5:hover .xz-name1{ display:block;}
+.xz6{
+	left: 261px;
+    top: 136px;
+	}
+.xz6:hover .xz-name1{ display:block;}
+.xz7{
+	left: 285px;
+    top: 226px;
+	}
+.xz7:hover .xz-name1{ display:block;}
+.xz8{
+	left: 558px;
+    bottom: 298px;
+	}
+
+.xz8:hover .xz-name1{ display:block;}
+
+.xz9{
+	left: 237px;
+    top: 339px;
+	}
+
+.xz9:hover .xz-name1{ display:block;}
+.xz10{
+	left: 436px;
+    bottom: 182px;
+	}
+
+.xz10:hover .xz-name1{ display:block;}
+.xz11{
+	 right: 179px;
+    top: 392px;
+	}
+
+.xz11:hover .xz-name1{ display:block;}
+
+.xz12{
+	background:url(jas.png) no-repeat;
+	background-size:100% 100%;
+	width: 97px;
+    height: 70px;
+    right: 311px;
+    bottom: 243px;
+	}
+
+.xz12:hover .xz-name1{ display:block;}
 
 
 

src/main/webapp/webpage/modules/leader/cloudChart/cloudChart.jsp

@@ -2,12 +2,13 @@
 <%@ include file="/webpage/include/taglib.jsp"%>
 <html>
 <head>
-	<title>发展党员管理</title>
+	<title>党建云图</title>
 	<meta name="decorator" content="ani"/>
 	<link rel="stylesheet" href="${ctxStaticWeb}/djyt/images/ja_dj.css">
 
 </head>
 <body>
+<div class="bj"></div><!--背景地图-->
 <div class="header">
 	<div class="time fl">
 		<span class="nyr">2022-08-17</span>&nbsp;&nbsp;&nbsp;<span class="sfm">09:35:57</span>
@@ -15,87 +16,127 @@
 	<div class="header_con">集安党建云图</div>
 </div>
 <div class="map">
-	<div id="tdj" class="map_div"><div class="map_tk tdj">
-		<h2>头道镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：头道镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="qhz" class="map_div"><div class="map_tk qhz">
-		<h2>清河镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：清河镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="cyz" class="map_div"><div class="map_tk cyz">
-		<h2>财源镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：财源镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="hdz" class="map_div"><div class="map_tk hdz">
-		<h2>花甸镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：花甸镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="tsz" class="map_div"><div class="map_tk tsz">
-		<h2>台上镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：台上镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="dlz" class="map_div"><div class="map_tk dlz">
-		<h2>大路镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：大路镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="ylz" class="map_div"><div class="map_tk lsx">
-		<h2>榆林镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：榆林镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="lsx" class="map_div"><div class="map_tk lsx">
-		<h2>凉水朝鲜族乡机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：凉水朝鲜族乡机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="jas" class="map_div"><div class="map_tk jas">
-		<h2>集安市机关党工委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：集安市机关党工委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<div id="twz" class="map_div"><div class="map_tk twz">
-		<h2>太王镇机关党委</h2>
-		<p>上级党委名称：集安市委</p>
-		<p>部门名称：太王镇机关党委</p>
-		<p>党组织类型：中共县级委员会派出工作委员会</p>
-		<p>党组织性质：是</p>
-		<p>直属机构：是</p>
-	</div></div>
-	<img src="${ctxStaticWeb}/djyt/images/map.png" style="width:100%;height: 100%;"/>
+	<div class="map-bj"></div>
+	<div class="zuobiao xz1">
+		<div class="map_div xz-name1">
+			<h2>集安市大路镇党委</h2>
+			<p>组织编码：005031303</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市大路镇党委</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz2">
+		<div class="map_div xz-name1">
+			<h2>集安市凉水朝鲜族乡党委</h2>
+			<p>组织编码：005031202</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：乡</p>
+			<p>单位名称：集安市凉水朝鲜族乡</p>
+			<p>单位隶属关系：乡</p>
+		</div>
+	</div>
+	<div class="zuobiao xz3">
+		<div class="map_div xz-name1">
+			<h2>集安市榆林镇党委</h2>
+			<p>组织编码：005031302</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市榆林镇党委</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz4">
+		<div class="map_div xz-name1">
+			<h2>集安市财源镇党委</h2>
+			<p>组织编码：005031306</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市财源镇</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz5">
+		<div class="map_div xz-name1">
+			<h2>集安市花甸镇党委</h2>
+			<p>组织编码：005031305</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市花甸镇</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz6">
+		<div class="map_div xz-name1">
+			<h2>集安市头道镇党委</h2>
+			<p>组织编码：005031307</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：头道镇人民政府</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz7">
+		<div class="map_div xz-name1">
+			<h2>集安市清河镇党委</h2>
+			<p>组织编码：005031308</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市清河镇</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz8">
+		<div class="map_div xz-name1">
+			<h2>集安市太王镇党委</h2>
+			<p>组织编码：005031617</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市太王镇党委</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz9">
+		<div class="map_div xz-name1">
+			<h2>集安市台上镇党委</h2>
+			<p>组织编码：005031304</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市台上镇</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz10">
+		<div class="map_div xz-name1">
+			<h2>集安市麻线乡党委</h2>
+			<p>组织编码：005031201</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：乡</p>
+			<p>单位名称：麻线乡</p>
+			<p>单位隶属关系：乡</p>
+		</div>
+	</div>
+	<div class="zuobiao xz11">
+		<div class="map_div xz-name1">
+			<h2>集安市青石镇党委</h2>
+			<p>组织编码：005031301</p>
+			<p>组织属性：党委</p>
+			<p>党组织属地关系：镇</p>
+			<p>单位名称：集安市青石镇</p>
+			<p>单位隶属关系：镇</p>
+		</div>
+	</div>
+	<div class="zuobiao xz12">
+		<div class="map_div xz-name1">
+			<h2>集安市委</h2>
+			<p>组织编码：005031</p>
+			<p>组织属性：中共市（地、州、盟）辖市委员会</p>
+			<p>党组织属地关系：县（市、区、旗）</p>
+			<p>单位名称：</p>
+			<p>单位隶属关系：</p>
+		</div>
+	</div>
 </div>
 <script type="text/javascript" src="${ctxStaticWeb}/djyt/images/jquery-3.3.1.min.js"></script>
 <script>
@@ -105,10 +146,10 @@
             CurrentTime()
         }, 1000);
 
-        $(".map_div").hover(function(){
-            $(this).children(".map_tk").show();
+        $(".xz1").hover(function(){
+            $(this).children(".map_div").show();
         },function(){
-            $(this).children(".map_tk").hide();
+            $(this).children(".map_div").hide();
         })