瀏覽代碼

no message

Fly 2 月之前
父節點
當前提交
f1002971b8
共有 6 個文件被更改,包括 170 次插入93 次删除
  1. 3 3
      package-lock.json
  2. 3 3
      pages/map/matterDetails.vue
  3. 5 5
      pages/map/model/siteList.vue
  4. 57 0
      utils/LonLatConvert - 副本.js
  5. 62 50
      utils/LonLatConvert.js
  6. 40 32
      utils/openApp.js

+ 3 - 3
package-lock.json

@@ -8,9 +8,9 @@
       "integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw=="
     },
     "gcoord": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmmirror.com/gcoord/-/gcoord-1.0.6.tgz",
-      "integrity": "sha512-Z+uyWrD2BTWmJOUvAdEAZQdQIVA5MFwUu7P5BfBdQEpLiVAsNw9mZF3/QbDJ4ZbfcJEnFKgHXOgUFXo5r/aVPg=="
+      "version": "1.0.7",
+      "resolved": "https://registry.npmmirror.com/gcoord/-/gcoord-1.0.7.tgz",
+      "integrity": "sha512-UCN2iSm69jBOYz2ma2eg5I5imp65Cj70rcTTfMNSNMvZpR1U6oGjmVh080aCvC/6lN1ClkuOoBeaLuebw9AZJg=="
     },
     "uview-ui": {
       "version": "2.0.38",

+ 3 - 3
pages/map/matterDetails.vue

@@ -108,9 +108,9 @@
 		}
 	}
 
-	/deep/ img,
-	/deep/ video,
-	/deep/ audio {
+	::v-deep img,
+	::v-deep video,
+	::v-deep audio {
 		max-width: 100%;
 	}
 </style>

+ 5 - 5
pages/map/model/siteList.vue

@@ -5,7 +5,7 @@
 			<view class="icon-box">
 				<image class="location-icon" src="/static/images/location-text.png" mode="aspectFit" />
 			</view>
-			<text class="location-val">{{`${info.cityName  || ''}${info.areaName  || ''}${info.address  || ''}`}}</text>
+			<text class="location-val">{{`${info.cityName || ''}${info.areaName  || ''}${info.address  || ''}`}}</text>
 		</view>
 		<view class="distance-box">
 			<view class="distance-num one-row">
@@ -77,8 +77,8 @@
 		mounted() {
 			this.getContentHeight()
 		},
-		watch:{
-			isShow(){
+		watch: {
+			isShow() {
 				this.$emit('refresh')
 			}
 		},
@@ -122,7 +122,7 @@
 				const name = `${provinceName}${cityName}${areaName}${address}`;
 				const code = areaCode || cityCode || provinceCode
 
-				openMap({ name, code: code, type: "baidu" })
+				openMap({ name, code, type: "gaode", info })
 			},
 			openSite(info) {
 				this.$emit('checkSiteDetails', info)
@@ -141,7 +141,7 @@
 								}
 							})
 							.exec();
-					} catch (error) {} 
+					} catch (error) {}
 					resolve(contentH)
 				})
 

+ 57 - 0
utils/LonLatConvert - 副本.js

@@ -0,0 +1,57 @@
+import AMapLoader from '@amap/amap-jsapi-loader';
+import $config from "@/config/index.js"
+
+export const getCoord = (parmas) => {
+	return new Promise((reslove, reject) => {
+		const { name, code, type } = parmas;
+		window._AMapSecurityConfig = {
+			securityJsCode: $config.secretKey,
+		};
+		// 配置高德API的key
+		AMapLoader.load({
+				"key":  $config.key,
+				"version": "2.0",
+				"plugins": []
+			})
+			.then((AMap) => { 
+				AMap.plugin('AMap.Geocoder', function() {
+					var geocoder = new AMap.Geocoder({
+						city: code // city 指定进行编码查询的城市,支持传入城市名、adcode 和 citycode
+					});
+
+					var addresses = [name];
+					// 使用高德逆编码,将天地图转换成高德地图
+					geocoder.getLocation(addresses, function(status, result) { 
+						if (status === 'complete' && result.info === 'OK') {
+							const val = result.geocodes[0];
+							reslove(val.location) 
+						}else{
+							reject()
+						}
+					});
+				});
+
+				// var gps = [longitude, latitude]; //需要转换的gps类型的坐标
+				// // var gps = [116.3, 39.9]; //需要转换的gps类型的坐标
+				// // 初始化地图实例
+				// console.log('AMap =', AMap, gps)
+				// // window.map = new AMap.Map('container', {
+				// //   zoom: 10, // 设置地图显示的缩放级别
+				// //   center: [116.397428, 39.90923] // 设置地图中心点坐标
+				// // });
+				// //参数说明:需要转换的坐标或者坐标组,需要转换的坐标类型,转换成功后的回调函数
+				// AMap.convertFrom(gps, "gps", function(status, result) {
+				// 	console.log('status, result =', status, result)
+				// 	//status:complete 表示查询成功,no_data 为查询无结果,error 代表查询错误
+				// 	//查询成功时,result.locations 即为转换后的高德坐标系
+				// 	if (status === "complete" && result.info === "ok") {
+				// 		var lnglats = result.locations; //转换后的高德坐标 Array.<LngLat>
+				// 		console.log(lnglats);
+				// 	}
+				// });
+			})
+			.catch(e => {
+				reject()
+			});
+	})
+}

+ 62 - 50
utils/LonLatConvert.js

@@ -1,57 +1,69 @@
 import AMapLoader from '@amap/amap-jsapi-loader';
 import $config from "@/config/index.js"
+import gcoord from 'gcoord';
 
 export const getCoord = (parmas) => {
 	return new Promise((reslove, reject) => {
-		const { name, code, type } = parmas;
-		window._AMapSecurityConfig = {
-			securityJsCode: $config.secretKey,
-		};
-		// 配置高德API的key
-		AMapLoader.load({
-				"key":  $config.key,
-				"version": "2.0",
-				"plugins": []
-			})
-			.then((AMap) => { 
-				AMap.plugin('AMap.Geocoder', function() {
-					var geocoder = new AMap.Geocoder({
-						city: code // city 指定进行编码查询的城市,支持传入城市名、adcode 和 citycode
-					});
-
-					var addresses = [name];
-					// 使用高德逆编码,将天地图转换成高德地图
-					geocoder.getLocation(addresses, function(status, result) { 
-						if (status === 'complete' && result.info === 'OK') {
-							const val = result.geocodes[0];
-							reslove(val.location) 
-						}else{
-							reject()
-						}
-					});
-				});
-
-				// var gps = [longitude, latitude]; //需要转换的gps类型的坐标
-				// // var gps = [116.3, 39.9]; //需要转换的gps类型的坐标
-				// // 初始化地图实例
-				// console.log('AMap =', AMap, gps)
-				// // window.map = new AMap.Map('container', {
-				// //   zoom: 10, // 设置地图显示的缩放级别
-				// //   center: [116.397428, 39.90923] // 设置地图中心点坐标
-				// // });
-				// //参数说明:需要转换的坐标或者坐标组,需要转换的坐标类型,转换成功后的回调函数
-				// AMap.convertFrom(gps, "gps", function(status, result) {
-				// 	console.log('status, result =', status, result)
-				// 	//status:complete 表示查询成功,no_data 为查询无结果,error 代表查询错误
-				// 	//查询成功时,result.locations 即为转换后的高德坐标系
-				// 	if (status === "complete" && result.info === "ok") {
-				// 		var lnglats = result.locations; //转换后的高德坐标 Array.<LngLat>
-				// 		console.log(lnglats);
-				// 	}
-				// });
-			})
-			.catch(e => {
-				reject()
-			});
+		const { name, code, type, longitude, latitude } = parmas;
+		console.log("name, code, type = ", longitude, latitude)
+		switch (type) {
+			case 'gaode':
+				// const [gcjLat, gcjLon] = wgs84ToGcj02(latitude, longitude);
+				// console.log("[gcjLat, gcjLon] = ", gcjLat, gcjLon)
+
+				const convertedCoords = gcoord.transform(
+					[longitude, latitude],
+					gcoord.WGS84, // 输入坐标系
+					gcoord.GCJ02 // 输出坐标系
+				);
+				console.log('convertedCoords = ', convertedCoords)
+				const data = {
+					lng: convertedCoords[0],
+					lat: convertedCoords[1]
+				}
+				reslove(data)
+
+		}
 	})
+}
+
+
+
+function wgs84ToGcj02(lat, lon) {
+	const a = 6378245.0;
+	const ee = 0.00669342162296594323;
+
+	function transform(lat, lon) {
+		let dLat = transformLat(lon - 105.0, lat - 35.0);
+		let dLon = transformLon(lon - 105.0, lat - 35.0);
+		const radLat = lat / 180.0 * Math.PI;
+		let magic = Math.sin(radLat);
+		magic = 1 - ee * magic * magic;
+		const sqrtMagic = Math.sqrt(magic);
+		dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * Math.PI);
+		dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * Math.PI);
+		return [lat + dLat, lon + dLon];
+	}
+
+	function transformLat(x, y) {
+		let ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y;
+		ret += (20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0 / 3.0;
+		ret += (20.0 * Math.sin(y * Math.PI) + 40.0 * Math.sin(y / 3.0 * Math.PI)) * 2.0 / 3.0;
+		ret += (160.0 * Math.sin(y / 12.0 * Math.PI) + 320 * Math.sin(y * Math.PI / 30.0)) * 2.0 / 3.0;
+		return ret;
+	}
+
+	function transformLon(x, y) {
+		let ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x));
+		ret += (20.0 * Math.sin(6.0 * x * Math.PI) + 20.0 * Math.sin(2.0 * x * Math.PI)) * 2.0 / 3.0;
+		ret += (20.0 * Math.sin(x * Math.PI) + 40.0 * Math.sin(x / 3.0 * Math.PI)) * 2.0 / 3.0;
+		ret += (150.0 * Math.sin(x / 12.0 * Math.PI) + 300.0 * Math.sin(x / 30.0 * Math.PI)) * 2.0 / 3.0;
+		return ret;
+	}
+
+	if (lon < 72.004 || lon > 137.8347 || lat < 0.8293 || lat > 55.8271) {
+		return [lat, lon]; // 不在国内,不转换
+	}
+
+	return transform(lat, lon);
 }

+ 40 - 32
utils/openApp.js

@@ -1,25 +1,30 @@
 import gcoord from "gcoord";
 import { getCoord } from "@/utils/LonLatConvert.js"
 // gaode
+// ‌天地图使用的坐标系是CGCS2000(中国大地坐标系统2000)
 export const openMap = (parmas = {}) => {
-	const { name, code, type } = parmas;
+	const { name, code, type, info: { longitude, latitude } } = parmas;
+	console.log("name, code, type = ", name, code, type, longitude, latitude)
 	uni.showLoading()
-	getCoord({ name, code }).then(res => {
-		const { lng, lat } = res; 
-		openApp({ lng, lat , type , name })
-	}).catch(err => {
-		uni.hideLoading()
-		uni.showToast({
-			title: '打开导航失败',
-			icon: "none"
-		})
+	getCoord({ name, code, type, longitude, latitude }).then(res => {
+		const { lng, lat } = res;
+		openApp({ lng, lat, type, name })
 	})
+	// getCoord({ name, code , type longitude, latitude}).then(res => {
+	// 	const { lng, lat } = res; 
+	// 	openApp({ lng, lat , type , name })
+	// }).catch(err => {
+	// 	uni.hideLoading()
+	// 	uni.showToast({
+	// 		title: '打开导航失败',
+	// 		icon: "none"
+	// 	})
+	// })
 }
 
 
 const openApp = (parmas = {}) => {
-		uni.hideLoading()
-	const { lng, lat , type , name } = parmas; 
+	const { lng, lat, type, name } = parmas;
 	let url;
 	switch (type) {
 		case 'baidu':
@@ -28,7 +33,7 @@ const openApp = (parmas = {}) => {
 			break;
 		case 'gaode':
 			url =
-				`iosamap://navi?sourceApplication=webapp&backScheme=myapp://&lat=${lat}&lon=${lng}&name=${encodeURIComponent(name)}&dev=0`;
+				`https://uri.amap.com/marker?position=${lng},${lat}&name=${encodeURIComponent(name)}&src=mypage&coordinate=gaode&callnative=0`;
 			break;
 		case 'tencent':
 			url =
@@ -37,26 +42,29 @@ const openApp = (parmas = {}) => {
 		default:
 			console.error('不支持的地图类型');
 			return;
-	} 
+	}
+	uni.hideLoading()
+	if (url) {
+		window.location.href = url
+	}
+	// // 使用iframe打开URL Scheme, 避免直接跳转导致页面卡死
+	// const iframe = document.createElement('iframe');
+	// iframe.style.display = 'none';
+	// iframe.src = url;
+	// document.body.appendChild(iframe);
+	// setTimeout(() => {
+	// 	document.body.removeChild(iframe);
+	// }, 1000);
 
-	// 使用iframe打开URL Scheme, 避免直接跳转导致页面卡死
-	const iframe = document.createElement('iframe');
-	iframe.style.display = 'none';
-	iframe.src = url;
-	document.body.appendChild(iframe);
-	setTimeout(() => {
-		document.body.removeChild(iframe);
-	}, 1000);
 
+	// // 定时器检测是否唤起成功,如果失败则跳转到网页版地图
+	// let timer = setTimeout(() => {
+	// 	window.location.href =
+	// 		`https://uri.amap.com/marker?position=${lng},${lat}&name=${encodeURIComponent(name)}&src=mypage&coordinate=gaode&callnative=0`; // 默认跳转高德网页版
+	// }, 2000);
 
-	// 定时器检测是否唤起成功,如果失败则跳转到网页版地图
-	let timer = setTimeout(() => {
-		window.location.href =
-			`https://uri.amap.com/marker?position=${lng},${lat}&name=${encodeURIComponent(name)}&src=mypage&coordinate=gaode&callnative=0`; // 默认跳转高德网页版
-	}, 2000);
+	// window.addEventListener('blur', () => {
+	// 	clearTimeout(timer)
+	// });
 
-	window.addEventListener('blur', () => {
-		clearTimeout(timer)
-	});
-
-}
+}