<route lang="json5" type="page">
{
layout: 'default',
style: { navigationBarTitleText: '轨迹' },
}
</route>
<template>
<!-- <view :style="{ marginTop: safeAreaInsets?.top + 'px' }"> -->
<view>
<map
id="mapdiv"
ref="map"
:longitude="longitude"
:latitude="latitude"
:show-compass="true"
:enable-traffic="true"
:enable-poi="true"
:show-location="true"
></map>
</view>
</template>
<script lang="ts" setup>
const { safeAreaInsets } = uni.getSystemInfoSync()
const longitude = ref(0)
const latitude = ref(0)
const enAblePoi = ref<boolean>(true)
const map = ref<any>()
onLoad(() => {
//获取定位
uni.getLocation({
type: 'gcj02',
success: (res) => {
console.log(res)
longitude.value = res.longitude
latitude.value = res.latitude
},
fail: (err) => {
console.log(err)
},
})
})
</script>
<style lang="scss" scoped>
//
#mapdiv {
width: 100vw;
height: 100vh;
}
</style>
lzp1214
- 发布：2024-11-28 20:17
- 更新：2024-11-28 20:17
- 阅读：11
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 19045.3803
手机系统： Android
手机系统版本号： Android 10
手机厂商： 华为
手机机型： 荣耀v20
页面类型： vue
vue版本： vue3
打包方式： 离线
项目创建方式： CLI
CLI版本号： 4.15
示例代码：
操作步骤：
<route lang="json5" type="page">
{
layout: 'default',
style: { navigationBarTitleText: '轨迹' },
}
</route>
<template>
<!-- <view :style="{ marginTop: safeAreaInsets?.top + 'px' }"> -->
<view>
<map
id="mapdiv"
ref="map"
longitude="longitude"
latitude="latitude"
show-compass="true"
enable-traffic="true"
enable-poi="true"
show-location="true"
></map>
</view>
</template>
<script lang="ts" setup>
const { safeAreaInsets } = uni.getSystemInfoSync()
const longitude = ref(0)
const latitude = ref(0)
const enAblePoi = ref<boolean>(true)
const map = ref<any>()
onLoad(() => {
//获取定位
uni.getLocation({
type: 'gcj02',
success: (res) => {
console.log(res)
longitude.value = res.longitude
latitude.value = res.latitude
},
fail: (err) => {
console.log(err)
},
})
})
</script>
<style lang="scss" scoped>
//
mapdiv {
width: 100vw;
height: 100vh;
}
</style>
<route lang="json5" type="page">
{
layout: 'default',
style: { navigationBarTitleText: '轨迹' },
}
</route>
</view>
</template>
<script lang="ts" setup>
const { safeAreaInsets } = uni.getSystemInfoSync()
const longitude = ref(0)
const latitude = ref(0)
const enAblePoi = ref<boolean>(true)
const map = ref<any>()
onLoad(() => {
//获取定位
uni.getLocation({
type: 'gcj02',
success: (res) => {
console.log(res)
longitude.value = res.longitude
latitude.value = res.latitude
},
fail: (err) => {
console.log(err)
},
})
})
</script>
<style lang="scss" scoped>
//
mapdiv {
width: 100vw;
height: 100vh;
}
</style>
预期结果：
出现定位图标，指南针等功能
出现定位图标，指南针等功能
实际结果：
什么都没有出现
什么都没有出现
bug描述：
在设置地图中等参数后，没有实际效果
