uni-app uni.getLocation type: 'gcj02' 获取地理位置方法使用

发布于 1周前 作者 bupafengyu 来自 Uni-App

uni-app uni.getLocation type: ‘gcj02’ 获取地理位置方法使用

获取不到精准位置，{"latitude":34.70089100861755,"longitude":113.8500332332034}
18:48:29.360 obj,  [Object] {"latitude":34.70089100861755,"longitude":113.8500332332034}
18:48:34.584 obj,  [Object] {"latitude":34.700915,"longitude":113.850012}
18:48:39.366 obj,  [Object] {"latitude":34.700915,"longitude":113.850012}
18:48:44.376 obj,  [Object] {"latitude":34.700915,"longitude":113.850012}
18:48:49.374 obj,  [Object] {"latitude":34.700915,"longitude":113.850012}
位置总是飘忽不定，用的是高德地图，不能一直获取到精准位置

Harmonyos Next教程
2 回复

最近好多定位的问题啊，官方也不出来看看吗


当然，以下是一个使用 uni-app 的 uni.getLocation 方法获取地理位置信息的代码示例，其中指定了 type: 'gcj02' 坐标系。gcj02 是中国测绘局制定的地理坐标系统，也被称为火星坐标系。

示例代码

1. 在 pages/index/index.vue 中编写代码

<template>
  <view>
    <button @click="getLocation">获取地理位置</button>
    <view v-if="location">
      <text>经度: {{ location.longitude }}</text>
      <text>纬度: {{ location.latitude }}</text>
      <text>速度: {{ location.speed }} m/s</text>
      <text>精度: {{ location.accuracy }} m</text>
      <text>高度: {{ location.altitude }} m</text>
      <text>垂直精度: {{ location.altitudeAccuracy }} m</text>
      <text>方向: {{ location.direction }} 度</text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      location: null
    };
  },
  methods: {
    getLocation() {
      uni.getLocation({
        type: 'gcj02', // 指定坐标系为 gcj02
        success: (res) => {
          this.location = res;
          console.log('获取地理位置成功', res);
        },
        fail: (err) => {
          console.error('获取地理位置失败', err);
        }
      });
    }
  }
};
</script>

<style scoped>
button {
  margin: 20px;
}
view {
  margin-top: 20px;
}
text {
  display: block;
  margin-bottom: 10px;
}
</style>

说明

  1. 模板部分 (<template>):

    • 一个按钮，当点击时调用 getLocation 方法。
    • 一个视图容器，当获取到地理位置信息时，显示相关信息。

  2. 脚本部分 (<script>):

    • data 中定义了一个 location 对象，用于存储获取的地理位置信息。
    • getLocation 方法调用 uni.getLocation 并指定 type: 'gcj02'。
    • 在 success 回调中，将返回的位置信息赋值给 location 对象，并在控制台打印信息。
    • 在 fail 回调中，打印错误信息。

  3. 样式部分 (<style scoped>):

    • 简单的样式定义，用于布局和美化界面。

注意事项

  • 确保 manifest.json 中已配置必要的权限，比如 scope.userLocation。
  • 在实际项目中，请考虑用户隐私和权限管理，确保用户已授权获取地理位置信息。
  • 在部分设备上，获取地理位置信息可能需要打开 GPS 或其他定位服务。

希望这个示例代码能帮助你快速实现 uni-app 中获取地理位置的功能。

回到顶部