From a66640923f167432ee85c672cdf175e5a0bb7eba Mon Sep 17 00:00:00 2001
From: hdw <496960745@qq.com>
Date: 星期一, 29 十月 2018 14:36:00 +0800
Subject: [PATCH] 返回地图的中心点

---
 gx_tieta/WebRoot/index.jsp                 |  100 ++++++++++++++-----
 gx_tieta/WebRoot/js/AreaRestriction_min.js |   56 +++++++++++
 gx_tieta/WebRoot/css/index_layout.css      |   67 +++++++++++++
 gx_tieta/WebRoot/pages/js/common.js        |   15 +++
 gx_tieta/WebRoot/css/common.css            |   54 ++++++++++
 5 files changed, 262 insertions(+), 30 deletions(-)

diff --git a/gx_tieta/WebRoot/css/common.css b/gx_tieta/WebRoot/css/common.css
index 545695c..9df4432 100644
--- a/gx_tieta/WebRoot/css/common.css
+++ b/gx_tieta/WebRoot/css/common.css
@@ -1,3 +1,29 @@
+/* margin-left */
+.mr5 {
+	margin-left: 5px;
+}
+.mr10 {
+	margin-left: 10px;
+	margin-right: 0;
+}
+
+/* font-color */
+.red {
+	color: #FF0000;
+}
+
+/* width em */
+.w8em {
+	width: 8em;
+}
+
+/* text-align */
+.alg-r {
+	text-align: right;
+}
+.alg-c {
+	text-align: center;
+}
 /* side-bar-menu妯″潡 */
 .whyc-sider-menu-container {
 	overflow: hidden;
@@ -122,6 +148,34 @@
 	border: 1px solid #ccc;
 }
 
+/* whyc-tab */
+.whyc-tab-card {
+	
+}
+.whyc-tab-card .whyc-tab-title {
+	position: relative;
+	border: 1px solid #e6e6e6;
+	height: 40px;
+	background-color: #f2f2f2;
+}
+
+
+.whyc-tab-title li {
+	display: inline-block;
+	vertical-align: middle;
+	min-width: 65px;
+	text-align: center;
+	line-height: 40px;
+	padding: 0 15px;
+	cursor: pointer;
+}
+.whyc-tab-card .whyc-tab-title li.whyc-tab-this {
+	line-height: 41px;
+	background-color: #FFFFFF;
+}
+
+
+
 /* jquery ui style */
 body .ui-front {
 	z-index: 999999;
diff --git a/gx_tieta/WebRoot/css/index_layout.css b/gx_tieta/WebRoot/css/index_layout.css
index bb33e29..59f6c84 100644
--- a/gx_tieta/WebRoot/css/index_layout.css
+++ b/gx_tieta/WebRoot/css/index_layout.css
@@ -450,3 +450,70 @@
 .item-timeout {
 	/* color: blue !important; */
 }
+
+.map-info-panel-left {
+	position: absolute;
+	top: 10px;
+	left: 10px;
+	z-index: 10;
+	background-color: #FFFFFF;
+	border: 1px solid #cccccc;
+}
+.map-info-panel-content {
+	position: relative;
+}
+
+.map-info-panel-content .map-info {
+	padding: 0 10px;
+	line-height: 30px;
+	text-align: center;
+	background-color: #CDDCFA;
+	border-bottom: 1px solid #CCCCCC;
+}
+.map-info-panel-content .map-info .k-point {
+	font-weight: bold;
+}
+.map-info-btn-icon {
+	margin-left: 15px;
+	font-size: 18px;
+	vertical-align: middle;
+	cursor: pointer;
+}
+.map-info-btn-icon:hover {
+	color: #1495E7;
+}
+
+.map-info-detail {
+	display: none;
+}
+.map-info-detail table {
+	width: 100%;
+	margin-top: 8px;
+	margin-bottom: 8px;
+}
+.map-info-detail table td {
+	padding: 4px 0;
+}
+.map-info-detail table select {
+	width: 96%;
+	height: 24px;
+	border: 1px solid #CCCCCC;
+}
+.map-info-footer {
+	padding: 8px 0;
+	border-top: 1px solid #CCCCCC;
+}
+.map-info-footer button {
+	padding:6px 20px;
+	border: 1px solid #c1c1c1;
+	background: #FFFFFF;
+	background: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f4f4f4));
+	background: -o-linear-gradient(top, #ffffff, #f4f4f4);
+	background: -ms-linear-gradient(top, #ffffff 0%,#f4f4f4 100%);
+	background: linear-gradient(top, #ffffff, #f4f4f4);
+	color: #555;
+}
+.map-info-footer button:hover {
+	background: #f4f4f4;
+	color: #555;
+}
\ No newline at end of file
diff --git a/gx_tieta/WebRoot/index.jsp b/gx_tieta/WebRoot/index.jsp
index 02a2a44..bb12f73 100644
--- a/gx_tieta/WebRoot/index.jsp
+++ b/gx_tieta/WebRoot/index.jsp
@@ -24,10 +24,12 @@
     
     <title><s:text name="HomePage"></s:text></title>
 	<meta name="renderer" content="webkit">
+	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
 	<!-- 瀵煎叆鐧惧害鍦板浘API -->
+	<link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
 	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=QAerSFEiGDCx1oHPB7Z5XYcBHI6R3qwx"></script>
 	<script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
-	<link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
+	<script type="text/javascript" src="js/AreaRestriction_min.js"></script>
 	<link href="css/basic.css" type="text/css" rel="stylesheet" />
 	<link href="css/common.css" type="text/css" rel="stylesheet" />
 	<link href="css/index_layout.css" type="text/css" rel="stylesheet" />
@@ -94,7 +96,6 @@
     	}
 	</style>
 	<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
-	
 	<script type="text/javascript" src="js/echarts.js"></script>
 	<script type="text/javascript" src="js/createTab.js"></script>
 	
@@ -108,20 +109,35 @@
 		<jsp:include page="nav.jsp" flush="true"/>
 		<!--瀵艰埅缁撴潫-->
 		<div id="content">
-			<!-- <div id="mapStatusOpts" class="map-status-container">
-				<div class="layui-form layui-form-pane">
-					<label class="layui-form-label">鏈烘埧绫诲瀷</label>
-					<div class="layui-input-inline">
-						<select name="warnType" id="warnType">
-							 <option value="0">鍏ㄩ儴</option>
-							 <option value="1">钀藉悗</option>
-							 <option value="2">鍛婅</option>
-							 <option value="3">寤舵椂</option>
-							 <option value="4">姝e父</option>
-						</select>
+			<!-- 鍦板浘鍐呭绛涢��  -->
+			<div class="map-info-panel-left">
+				<div class="map-info-panel-content">
+					<div class="map-info">
+						<span>闄愬埗鏄剧ず鍖哄煙: </span><span class="k-point red" id="mapVsArea">涓浗</span>
+						<span class="mr5">鏈烘埧鏄剧ず绫诲瀷:</span><span class="k-point red" id="mapIconStyle">鍏ㄩ儴</span>
+					</div>
+					<div class="map-info-detail">
+						<table>
+							<tbody>
+								<tr>
+									<td class="w8em alg-c">鏈烘埧鏄剧ず绫诲瀷:</td>
+									<td>
+										<select name="mapIconStyleSel" id="mapIconStyleSel">
+											<option>鍏ㄩ儴</option>
+											<option>宸插畨瑁�</option>
+											<option>鏈畨瑁�</option>
+										</select>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+						<div class="map-info-footer alg-r">
+							<button type="button" class="mr10 map-panel-hide" value="纭畾" id="mapPanelEn">纭畾</button>
+							<button type="button" class="mr10 map-panel-hide" value="闅愯棌">闅愯棌</button>
+						</div>
 					</div>
 				</div>
-			</div> -->
+			</div>
 			<div class="nav-map small">
 				<!-- 鐢垫睜鍒嗗竷鍥� -->
 				<div class="china-map" id="map">
@@ -598,7 +614,7 @@
 				centerMapByPoint(map); // 鏍规嵁褰撳墠鐢ㄦ埛璁惧畾鐨勪綅缃樉绀轰腑蹇冪偣
 				map.enableScrollWheelZoom();
 				map.disableDoubleClickZoom();
-				map.setMapStyle({style: 'grayscale'});	//  璁剧疆鍦板浘鐨勯鏍�
+				//map.setMapStyle({style: 'grayscale'});	//  璁剧疆鍦板浘鐨勯鏍�
 				// 娣诲姞鍦板浘绫诲瀷鎺т欢
 				map.addControl(new BMap.MapTypeControl());
 				// 缁欏湴鍥炬坊鍔犲伐鍏锋潯(鍦板浘-鍗槦-涓夌淮)鍜屾瘮渚嬪昂鎺т欢
@@ -639,6 +655,17 @@
 				var menu = new BMap.ContextMenu();
 				var txtMenuItem = [
 					{
+						text: '璁剧疆涓績鐐�',
+						callback: function(e) {
+							myConfirm.show({
+								title: '璁剧疆鍦板浘榛樿鏄剧ず浣嶇疆',
+								content: '鏄惁纭淇敼鍦板浘榛樿涓績鍧愭爣',
+								enfun:updateMapCenterPoint,
+								enparams:[e]
+							});
+						}
+					},
+					{
 						text: '鎼滅储鍦板潃',
 						callback: function(e) {
 							search.showSearch();
@@ -659,17 +686,13 @@
 							smallMap();
 						}
 					},
+					
 					{
-						text: '璁剧疆涓績鐐�',
+						text: '杩斿洖涓績鐐�',
 						callback: function(e) {
-							myConfirm.show({
-								title: '璁剧疆鍦板浘榛樿鏄剧ず浣嶇疆',
-								content: '鏄惁纭淇敼鍦板浘榛樿涓績鍧愭爣',
-								enfun:updateMapCenterPoint,
-								enparams:[e]
-							});
+							centerMapByPoint(map);
 						}
-					}
+					},
 				];
 				//console.info(getPermit('taskchange_edit_permit', permits)+"*******");
 				if(getPermit('batt_map_edit_permit', permits)) {
@@ -1372,6 +1395,7 @@
 	});
 	
 	$(window).resize(function() {
+		console.log(123);
 		getMapHt();
 	});
 	// 鏀瑰彉div鐨勫ぇ灏�
@@ -1609,7 +1633,7 @@
 	}
 	
 	// 鐢熸垚鍦板浘鍥炬爣
-	function createMapDot(map, dotList) {
+	function createMapDot(map, dotList, isTop) {
 		// 娓呯┖瑕嗙洊鐗╁拰瀵瑰簲鐨刴k鐐�
 		mkList = [];
 		
@@ -1644,6 +1668,11 @@
 				//showMapPanel(target, dotList);
 				searchPanelInfo(target);
 			});
+			
+			if(isTop) {
+				mk.setTop(true);
+			}
+			
 			mkList.push(mk);
 			// 鍚戝湴鍥炬坊鍔犺鐩栫墿
 			map.addOverlay(mk);
@@ -2204,7 +2233,7 @@
 	        data: "json="+JSON.stringify(mapPages),
 	        success: function(result) {
 	        	var data = JSON.parse(result.result);
-	        	console.log(data);
+	        	//console.log(data);
 	        	for(var i=0; i<data.length; i++) {
 	        		var _data = data[i];
 	        		var _list =  formatUpdateStation(_data);
@@ -2216,12 +2245,12 @@
 	        		}
 	        	}
 	        	
-	        	console.log(updateStationData);
-	        	createMapDot(map, updateStationData);
+	        	//console.log(updateStationData);
+	        	createMapDot(map, updateStationData, true);
 	        	
 	        	// 鏇存柊鍒嗛〉淇℃伅
 	        	mapPages.pageCurr++;
-	        	if(mapPages.pageCurr>mapPages.pageNum) {
+	        	if(mapPages.pageCurr>mapPages.pageNum || updateStationData.length<mapPages.pageSize) {
 	        		mapPages.pageCurr=1;
 	        		mapPages.pageNew=false;
 	        	}
@@ -3493,7 +3522,20 @@
 	        	} 				
 			});
 		}
-		
+		var mapViewArea = GLOBAL.BMap.mapViewArea;
+		// 鏄剧ず榛樿鍖哄煙-涓浗
+		setMapViewArea(mapViewArea[0]);		
+		// 璁剧疆鍦板浘鐨勫彲瑙嗗尯鍩�
+		function setMapViewArea(data) {
+			var left = new BMap.Point(data.left.lng, data.left.lat);
+			var right = new BMap.Point(data.right.lng, data.right.lat);
+			var b = new BMap.Bounds(left, right);
+			try {
+				BMapLib.AreaRestriction.setBounds(map, b);
+			} catch (e) {
+				alert(e);
+			}
+		}
 	});
 	</script> 
 </html>
diff --git a/gx_tieta/WebRoot/js/AreaRestriction_min.js b/gx_tieta/WebRoot/js/AreaRestriction_min.js
index d477323..ec87afd 100644
--- a/gx_tieta/WebRoot/js/AreaRestriction_min.js
+++ b/gx_tieta/WebRoot/js/AreaRestriction_min.js
@@ -1 +1,55 @@
-var BMapLib=window.BMapLib=BMapLib||{};(function(){var b=BMapLib.AreaRestriction=function(){};var a=false;var c=null;var d=null;b.setBounds=function(f,e){if(!f||!e||!(e instanceof BMap.Bounds)){throw"\u8bf7\u68c0\u67e5\u4f20\u5165\u53c2\u6570\u503c\u7684\u5408\u6cd5\u6027";return false}if(a){this.clearBounds()}c=f;d=e;c.addEventListener("moveend",this._mapMoveendEvent);a=true;return true};b._mapMoveendEvent=function(k){if(d.containsBounds(c.getBounds())){return}var i=c.getBounds(),h=i.getSouthWest(),g=i.getNorthEast(),m=d.getSouthWest(),j=d.getNorthEast();var l={n:0,e:0,s:0,w:0};l.n=(g.lat<j.lat)?g.lat:j.lat;l.e=(g.lng<j.lng)?g.lng:j.lng;l.s=(h.lat<m.lat)?m.lat:h.lat;l.w=(h.lng<m.lng)?m.lng:h.lng;var f=new BMap.Point(l.w+(l.e-l.w)/2,l.s+(l.n-l.s)/2);setTimeout(function(){c.panTo(f,{noAnimation:"no"})},1)};b.clearBounds=function(){if(!a){return}c.removeEventListener("moveend",this._mapMoveendEvent);a=false}})();
\ No newline at end of file
+var BMapLib = window.BMapLib = BMapLib || {};
+(function() {
+    var b = BMapLib.AreaRestriction = function() {};
+    var a = false;
+    var c = null;
+    var d = null;
+    b.setBounds = function(f, e) {
+        if (!f || !e || !(e instanceof BMap.Bounds)) {
+            throw "璇锋鏌ヤ紶鍏ュ弬鏁板�肩殑鍚堟硶鎬�";
+            return false;
+        }
+        if (a) {
+            this.clearBounds();
+        }
+        c = f;
+        d = e;
+        c.addEventListener("moveend", this._mapMoveendEvent);
+        a = true;
+        return true;
+    };
+    b._mapMoveendEvent = function(k) {
+        if (d.containsBounds(c.getBounds())) {
+            return
+        }
+        console.log(c.getBounds());
+        var i = c.getBounds(),
+            h = i.getSouthWest(),
+            g = i.getNorthEast(),
+            m = d.getSouthWest(),
+            j = d.getNorthEast();
+        var l = {
+            n: 0,
+            e: 0,
+            s: 0,
+            w: 0
+        };
+        l.n = (g.lat < j.lat) ? g.lat : j.lat;
+        l.e = (g.lng < j.lng) ? g.lng : j.lng;
+        l.s = (h.lat < m.lat) ? m.lat : h.lat;
+        l.w = (h.lng < m.lng) ? m.lng : h.lng;
+        var f = new BMap.Point(l.w + (l.e - l.w) / 2, l.s + (l.n - l.s) / 2);
+        setTimeout(function() {
+            c.panTo(f, {
+                noAnimation: "no"
+            });
+        }, 1);
+    };
+    b.clearBounds = function() {
+        if (!a) {
+            return
+        }
+        c.removeEventListener("moveend", this._mapMoveendEvent);
+        a = false;
+    };
+})();
\ No newline at end of file
diff --git a/gx_tieta/WebRoot/pages/js/common.js b/gx_tieta/WebRoot/pages/js/common.js
index cfd0a9f..4e407d3 100644
--- a/gx_tieta/WebRoot/pages/js/common.js
+++ b/gx_tieta/WebRoot/pages/js/common.js
@@ -450,6 +450,21 @@
 	gl.CMD.e61850.getDischargeParm = 41;				//鑾峰彇鍙傛暟
 })(jQuery, window, document, GLOBAL);
 
+// 鍦板浘淇℃伅
+;(function($, window, document, gl, undefined) {
+	// 瀹氫箟BMap鐨勫懡鍚嶇┖闂�
+	gl.namespace('BMap');
+	// 鍦板浘鍙鍖哄煙瀹氫箟
+	var mapViewArea = [
+	    {name: '涓浗',area:'涓浗' ,left: {lng:71.3822, lat:0.6212}, right: {lng: 139.526,lat:54.3093}},
+	];
+	
+	// 灏嗗彉閲弇apView缁戝畾鍒癎LOBAL.BMap涓�
+	gl.BMap.mapViewArea = mapViewArea;
+	
+})(jQuery, window, document, GLOBAL);
+
+
 // 鐢熸垚闃块噷鍥炬爣鐨勫厓绱�
 function create_ali_font(cla, color, data) {
 	var i = $('<i class="icon iconfont"></i>');

--
Gitblit v1.9.1