【高德JS API】记录一下API不同版本导致setFitView()渲染效果不同的情况

问题的产生

最近在用VUE做前端项目重构时遇到了地图相关需求，于是和原先项目一样接入了高德JS API~

需求的具体表现是这样的：

原本地图中有一个marker和以marker为圆心的circle：

当用户点击地图上的某个位置，需要让marker和circle移动过去，并且地图也要自适应地将其重新显示在中央。所谓自适应，就是你能看到地图的视野跟随新点做出了移动调整：

如上图，marker地点更新后，地图会向左上方移动视野！

然后我参考同事的代码，为amap对象添加了有关事件：

          this.map.on('click', (ev) => {
            console.log(ev)
            //重新设置marker和circle，把位置切换过去
            marker.setPosition(ev.lnglat)
            this.fenceCircle.setCenter(ev.lnglat)
            this.map.setFitView()
          })

看起来没有什么问题，也符合前同事的代码思路，可是调试后发现渲染效果出了问题。。。

虽然地点也更新了，地图也确实把它展示在中央了，但是，这是在一瞬间完成的。。。。然后你就会感觉，嘿？点击后怎么marker和circle没动？固定在中央了？？就背后的地图在动？？

原因探索

经过我的苦苦搜寻，最后终于确定了问题出在一个最不起眼的地方，原先代码使用的高德版本是1.3： 

<script type="text/javascript"
        src="http://webapi.amap.com/maps?v=1.3&key=**************************&plugin=AMap.DistrictSearch"></script>

当我把它改成1.4.15后，运行旧代码……同样的问题出现了！！

问题解决

找到了bug的原因后解决bug就简单的多了，除了更改版本以外，还有一种解决方法是使用 map.setCenter()方法，设置地图中心点，就能实现地图的丝滑移动了~