zoukankan      html  css  js  c++  java
  • 百度地图如何把marker点定位到任何位置?

     需求如图:保证每次点击设备都能让点移动到中间偏下的位置,从而达到信息窗口可以完美显示。

    开发环境 vue^2.6.11 + vue-baidu-map 我们直接在地图初始化的时候保存了地图对象 this.map, this.BMap

    相信大家都知道百度提供一个平移到某个经纬度的方法

    
    
     const point = new this.BMap.Point(lng, lat)
    this.map.panTo(point)

    这个方法只是将某个坐标平移到中心点(也可以叫切换中心点),此方法并不能直接平移到自己想要的位置

    不难想到,只要在这个平移到这个经纬度之前减去对应的经纬度就能让点平移到任意位置了例如:

    //向下平移0.005经纬度
    const lat
    = Number(list.latitude) + 0.005 const point = new this.BMap.Point(lng, lat) this.map.panTo(point)

    这种方法虽然难调整,但是看上去似乎可行。松了一口气,滚了一下滚轮,当地图缩放改变,你再去点的时候位置又偏移了。

    通过多次实验不难发现规律,当地图缩放每增加一,你所调整的(经纬度)就减少一半,于是我灵机一动就出现下面的代码:

    infoWindowOpen(list) {
      //此时我已经无法解释560是什么东西了。。。
        const lat = Number(list.latitude) + 560 / Math.pow(2, this.zoom + 1)
        const point = new this.BMap.Point(list.longitude, lat)
        this.map.panTo(point)
     }

    这个时候我已经无法解释560是什么东西了,往下的距离,这里之所以在zoom + 1只是想尽量勉强解释一下这560是在1080*1920下点到窗口顶部560px,有兴趣的可以研究一下,欢迎留言指教。

  • 相关阅读:
    Java学习笔记 -StringBuffer & StringBuilder
    Java学习笔记
    java学习笔记 -数组
    关于运放采集电路如何自动切换量程电路
    仪器仪表运放的放大倍数的一些问题
    二极管、三极管和mos管使用总结
    mos管缓启动和防反接电路原理
    关于产生负电源电路
    可靠性测试之画pcb
    AD软件pcb电路板各图层的理解
  • 原文地址:https://www.cnblogs.com/yzoro/p/14558931.html
Copyright © 2011-2022 走看看