yin_yu820
/
yd_qycpfb


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
							<!DOCTYPE html>
<html style="">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport"
			content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
		<title></title>
		<script src="./js/jquery3.5.js" type="text/javascript"></script>
		<!-- 引入uniapp -->
		<script src="./js/hybrid_html_uni.webview.1.5.5.js" type="text/javascript"></script>
		<!-- 引入天地图 -->
		<script src="http://api.tianditu.gov.cn/api?v=4.0&tk=ffb54337376426c1941e6d6bf5b5f8e5" type="text/javascript"></script>
		
		<script>
			let map; //地图实例
			let zoom = 16; //缩放等级

			//等待dom加载
			function onLoad() {
				let lnglat = {};
				map = new T.Map('mapDiv'); //实例化地图 120.139726,33.345562
				map.centerAndZoom(new T.LngLat(120.139726, 33.345562), zoom); //默认数值

				//创建比例尺控件对象
				var scale = new T.Control.Scale();
				//添加比例尺控件
				map.addControl(scale);
				//创建缩放平移控件对象
				var control_zoom = new T.Control.Zoom();
				control_zoom.setPosition(T_ANCHOR_BOTTOM_RIGHT);
				// control_zoom.setOffset();
				//添加缩放平移控件
				map.addControl(control_zoom);
				
				 // 添加控件
				var ctrl = new T.Control.MapType([
					{
						title: "地图", //地图控件上所要显示的图层名称
						icon: "http://api.tianditu.gov.cn/v4.0/image/map/maptype/vector.png", //地图控件上所要显示的图层图标（默认图标大小80x80）
						layer: TMAP_NORMAL_MAP //地图类型对象，即MapType。
					},
					{
						title: "卫星",
						icon: "http://api.tianditu.gov.cn/v4.0/image/map/maptype/satellite.png",
						layer: TMAP_SATELLITE_MAP
					}
				]);
				// map.addControl(ctrl);
				

				let geolocation = new T.Geolocation()

				//获取当前用户经纬度
				// geolocation.getCurrentPosition(function(e) {
				// 	//根据经纬度重新设置地图
				// 	if (this.getStatus() == 0) {
				// 		map.centerAndZoom(e.lnglat, 16)
				// 	}
				// 	if (this.getStatus() == 1) {
				// 		map.centerAndZoom(e.lnglat, e.level)
				// 	}
				// });
				
				// 等待uniapp加载完成后发送信息
				document.addEventListener('UniAppJSBridgeReady', function() {
					// uni.postMessage({
					// 	data: {
					// 		title: '天地图',
					// 		msg: "zzww"
					// 	},
					// })
				})
				
				$.ajax({
					url: "/api/map/mapVisualization/getBuildingList",
					dataType: "json",
					type: "get",
					success: function (data) {
						console.log( data );
						if (data != null && data.length > 0) {
							batchMark( data );
						}
					},
					error:function(){
						alert( "请求楼宇信息失败！" );
					},
				});
			} //  function onLoad

			// 批量添加标注
			function batchMark(buildingData) {
				if (buildingData != null && buildingData.length > 0) {
					var pointArray = new Array();
					for (var i = 0; i < buildingData.length; i++) {
						var point = new T.LngLat(buildingData[i].building_longitude, buildingData[i].building_latitude);
						var marker = new T.Marker(point); // 创建标注
						marker.markerName = buildingData[i].building_name;
						marker.buildingId = buildingData[i].building_id;
						marker.addEventListener("click", markerClick);
						map.addOverLay(marker);
						pointArray[i] = point;
					}
					//让所有点在视野范围内
					map.setViewport(pointArray);
				}
			}

			function markerClick(e) {
				uni.postMessage({
					data: {
						buildingId: e.target.buildingId,
						buildingName: e.target.markerName
					},
				})
			}

			//传递楼宇信息
			window.msgFromUniapp = function(buildingData) {
				batchMark(buildingData)
			}
		</script>

		<style>
			body,
			html {
				padding: 0;
				margin: 0;
				width: 100%;
				height: 100%;
				transform: translateX(-1.5px);
			}

			.tdt-control-copyright {
				display: none !important;
			}

			.tdt-control-datasources {
				display: none !important;
			}
		</style>
	</head>
	<body style="width:100%; height:100%" onLoad="onLoad()">
		<div id="mapDiv" style="width:100%; height:100%"></div>
	</body>
</html>