uni-app地图缩放中心点问题

在uni-app中，处理地图缩放时保持中心点的问题，通常需要借助地图组件提供的相关属性和事件。在map组件中，scale属性用于设置地图缩放级别，而longitude和latitude属性用于设置地图中心点坐标。为了保持缩放时的中心点，你可以监听地图的缩放事件，并动态调整中心点坐标。

以下是一个示例代码，展示了如何在uni-app中实现这一功能：

<template>
  <view class="container">
    <map
      id="map"
      :longitude="longitude"
      :latitude="latitude"
      :scale="scale"
      @regionchange="onRegionChange"
      style="width: 100%; height: 300px;"
    >
      <!-- 地图标记点等可在此添加 -->
    </map>
  </view>
</template>

<script>
export default {
  data() {
    return {
      longitude: 116.397428, // 初始经度
      latitude: 39.90923,    // 初始纬度
      scale: 14,             // 初始缩放级别
      targetLongitude: null, // 目标经度（用于保持中心点）
      targetLatitude: null   // 目标纬度（用于保持中心点）
    };
  },
  methods: {
    onRegionChange(e) {
      // 当地图区域发生变化时触发
      const { longitude, latitude } = e.detail;
      // 保存当前中心点作为下次缩放时的目标中心点
      this.targetLongitude = longitude;
      this.targetLatitude = latitude;
      
      // 此处可以根据需要添加其他逻辑，如限制缩放级别等
    },
    adjustCenterOnScale() {
      // 假设在某个条件下需要调整地图中心点（例如缩放后）
      if (this.targetLongitude && this.targetLatitude) {
        this.longitude = this.targetLongitude;
        this.latitude = this.targetLatitude;
      }
    }
    // 注意：通常不需要手动调用adjustCenterOnScale，因为regionchange事件会自动更新targetLongitude和targetLatitude
  },
  mounted() {
    // 可以在页面加载完成后进行一些初始化操作，如设置地图标记点等
  }
};
</script>

<style scoped>
.container {
  padding: 20px;
}
</style>

在这个示例中，我们使用了map组件的regionchange事件来监听地图区域的变化。当用户缩放地图时，事件会触发，并且我们可以通过事件对象获取当前的中心点坐标，然后将其保存到targetLongitude和targetLatitude中。这样，即使地图进行了缩放操作，中心点坐标也被保存下来，可以在需要时重新设置为地图的中心点。

注意，这个示例并没有手动调用adjustCenterOnScale方法，因为在实际应用中，通常不需要这样做。regionchange事件已经足够用来动态调整并保存中心点坐标。如果需要在特定条件下调整中心点，可以在adjustCenterOnScale方法中添加相应逻辑。