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>