高德、百度、ARCGIS api 设置视图、中心点

目录

• 一、前言
• 二、ARCGIS API
• 三、高德地图
•  四、百度地图

一、前言

在 webgis 中经常会用到缩放到某一个要素，视图缩放不同级别等问题。对于不同的要素方法会不一样。

而且对于不同的地图具体实现也不一样。

二、ARCGIS API

arcgis 中对视图操作主要是通过 mapview 来设置的。

一般设置的方式有：

// 设置视图中心
this.$map.mapview.center = [point.lon, point.lat]

// 设置视图的范围，这里是把要居中显示的要素 extent 赋值给 mapview
this.$map.mapview.extent = geometry.extent.expand(1.5)

// 视图移动到目标要素，并可指定层级
this.$map.mapview.goTo({ target: geometry, zoom: 18 })

三、高德地图

高德地图直接就是在 map 对象上面设置

可以设置的方式有：

// 设置中心点
this.Map.setCenter(point)

// 设置缩放级别
this.Map.setZoom(15)

// 同时设置缩放级别和中心点
this.Map.setZoomAndCenter(15,point)

// 设置显示城市，不建议和上面的同时使用
this.Map.setCity(city，callbac)

// 设置地图的显示范围，bound 是范围的两个角点位
this.Map.setBounds(bound)

// 地图中心点评议到指定点位
this.Map.panTo(point)

// 以像素为单位，平移地图
this.Map.panBy(x,y)

// 设置合适的视图，可以直接传入要素 
this.Map.setFitView(this.riverLine)

 四、百度地图

百度地图也是主要在 Map 对象上面设置

// 设置中心点和缩放级别
this.Map.centerAndZoom(point,zoomIndex)
this.Map.centerAndZoom('杭州市')    // 可以直接设置地区

// 设置视图范围
this.Mpa.setViewport(pointArray)

// 移动到指定点
this.Map.panTo(point)

// 移动像素
this.Map.panBy(x,y)

// 飞到指定点和级别
this.Map.flyTo(point,zoomIndex)

// 设置中心点
this.Map.setCenter(point)

// 设置缩放级别
this.Map.setZoom(zoomIndex)

从上面可以看出高德、百度对地图缩放、设置中心点的操作方式比较多，而且二者也很相似。