uniapp map show-location 不显示是什么原因

在uniapp中使用map组件时，设置了show-location属性但定位图标不显示，是什么原因？已经确认在manifest.json中配置了地图权限和key，手机也开启了GPS定位，但地图上始终不显示蓝色定位点。请问可能是什么问题导致的？需要检查哪些配置或代码？

2 回复

uniapp map组件不显示位置，可能原因：

  1. 未获取定位权限
  2. 缺少经纬度数据
  3. 地图组件宽高未设置
  4. 经纬度格式错误
  5. 真机调试需配置manifest.json

检查定位权限和经纬度数据是否正确传递。


在UniApp中，map 组件的 show-location 属性不显示当前位置标记，通常由以下原因导致：

  1. 权限问题

    • 未获取定位权限（Android需动态申请，iOS需配置权限描述）。
    • 检查 manifest.json 中是否配置了定位权限（如 "permission": {"scope.userLocation": {...}}）。

  2. API调用问题

    • 仅设置 show-location 为 true 不会自动获取位置，需配合 uni.getLocation() 获取坐标并设置到 map 的 latitude 和 longitude。

  3. 属性配置错误

    • 确保 map 组件正确绑定经纬度数据。

解决方案示例代码：

<template>
  <view>
    <map 
      :latitude="latitude" 
      :longitude="longitude" 
      :show-location="true"
      style="width: 100%; height: 300px;"
    ></map>
  </view>
</template>

<script>
export default {
  data() {
    return {
      latitude: 0,
      longitude: 0
    }
  },
  onLoad() {
    this.getLocation();
  },
  methods: {
    getLocation() {
      uni.getLocation({
        type: 'gcj02', // 坐标系类型
        success: (res) => {
          this.latitude = res.latitude;
          this.longitude = res.longitude;
        },
        fail: (err) => {
          uni.showToast({ title: '获取位置失败', icon: 'none' });
        }
      });
    }
  }
}
</script>

关键步骤：

  1. 在 manifest.json 中配置定位权限。
  2. 调用 uni.getLocation 获取坐标并更新 map 的经纬度。
  3. 确保 show-location="true" 且坐标系一致（如 gcj02）。

若仍不显示，检查真机调试及系统定位服务是否开启。

回到顶部