本文介绍: 指定可视范围的时候,只用includepoints会很极限。导致marker不能完全显示规划驾车线路的时候,使用uni的。

问题背景

规划驾车线路的时候,使用uniinclude-points指定可视范围的时候,会很极限。导致marker不能完全显示
在这里插入图片描述

解决方法

  1. 地图显示范围添加padding (推荐)
 <map
        id="myMap"
        :markers="markers"
        :polyline="polyline"
        :longitude="curLongitude"
        :latitude="curLatitude"
        @markertap="markertap"
 ></map>
onLoad((e) => {
 uni.createMapContext('myMap', this).includePoints({
      padding: [120, 110, 120, 110],
      points: [
        { latitude: startCityLat.value, longitude: startCityLog.value },
        { latitude: endCityLat.value, longitude: endCityLog.value }
      ]
    });
});
  1. 或者获取修改缩放地图(记得设置中心点)
const appMapRef = ref('');
appMapRef.value = uni.createMapContext('myMap');
appMapRef.value.getScale({
    success: (res) => {
      console.log('缩放', res);
      mapScale.value = res.scale - 1;
      console.log('mapScale.value', mapScale.value);
    }
  });

uni文档点击这里

1的效果图
在这里插入图片描述

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注