NN2022112805/addons/h5/pages/index/map.vue

<template>
	<view class="main">
		<!-- <iframe
			:src="'https://apis.map.qq.com/uri/v1/marker?marker=coord:'+location.latitude+','+location.longitude+';title:'++';addr:'+info.title+'&referer='"
			frameborder="0"></iframe> -->
		<map v-if="location.latitude" class="qq-map" id="map" :markers="markers" :subkey="mapKey"
			:longitude="location.longitude" :latitude="location.latitude" scale="14" :polyline="polyline"
			layer-style="style1"></map>

		<tabbar :index="type"></tabbar>
	</view>
</template>

<script>
	import tabbar from '../../components/tabbar.vue'
	var QQMapWX = require('../../common/qqmap-wx-jssdk.min.js');
	var qqmapsdk;
	export default {
		components: {
			tabbar
		},
		data() {
			return {
				mapKey: '',
				markers: [],
				location: {
					longitude: '',
					latitude: ''
				},
				info: {
					title: ''
				},
				polyline: [],
				type: '1',
			}
		},
		onLoad(options) {
			var _this = this
			console.log(options)
			var latitude = typeof(options.latitude) != 'undefined' ? options.latitude : '';
			var longitude = typeof(options.longitude) != 'undefined' ? options.longitude : '';
			var location = typeof(options.location) != 'undefined' ? options.location : '';
			_this.type = typeof(options.type) != 'undefined' ? parseInt(options.type) : 1;
			_this.info.title = typeof(options.title) != 'undefined' ? options.title : '商家位置';
			_this.mapKey = _this.$request.mapKey
			//获取当前的地理位置、速度
			if (!location || !latitude || !longitude) {
				_this.$u.toast('参数错误');
				setTimeout(function() {
					uni.navigateBack({
						delta: '-1'
					})
				}, 800);
				return false;
			}

			// 获取定位
			uni.getLocation({
				type: 'wgs84', //腾讯地图使用gcj02获取位置坐标
				altitude: true,
				geocode: true,
				highAccuracyExpireTime: 100,
				success: function(res) {
					console.log('当前位置的经度：' + res.longitude);
					console.log('当前位置的纬度：' + res.latitude);

					res.expired = (new Date()).getTime() + 10000
					_this.location = res
					uni.setStorageSync('rrc.location', JSON.stringify(res))
					uni.openLocation({
						type: 'gcj02',
						latitude: parseFloat(latitude),
						longitude: parseFloat(longitude),
						name: _this.info.title,
						address: location,
						scale: 28
					})
				},
				fail: function(err) {
					uni.getSystemInfo({
						success(res) {
							// 安卓
							var plusObj = typeof(plus) != 'undefined' ? plus : ''
							if (res.platform == 'android' && plusObj) {
								var context = plus.android.importClass(
									'android.content.Context');

								var locationManager = plus.android.importClass(
									'android.location.LocationManager');
								var main = plus.android.runtimeMainActivity();
								var mainSvr = main.getSystemService(context.LOCATION_SERVICE);
								if (!mainSvr.isProviderEnabled(locationManager.GPS_PROVIDER)) {
									uni.showModal({
										title: '提示',
										content: '请打开定位服务功能，并授权',
										showCancel: false,
										success(result) {
											if (result.confirm == true) {
												if (!mainSvr.isProviderEnabled(
														locationManager.GPS_PROVIDER
													)) {
													var Intent = plus.android
														.importClass(
															'android.content.Intent');
													var Settings = plus.android
														.importClass(
															'android.provider.Settings'
														);
													var newIntent = new Intent(Settings
														.ACTION_LOCATION_SOURCE_SETTINGS
													);
													main.startActivity(newIntent);
												}
											}
										}
									})
								}
							} else {
								_this.$u.toast('打开定位失败');
							}

						},
						fail() {
							_this.$u.toast('打开定位失败');
						}
					})
					console.log(err)

				}
			});
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.map,
	.qq-map {
		width: 100%;
		height: 100%;
	}
</style>