高德地图之地图的属性-白红宇

中英文设置

map.setLang('en'); 英文map.setLang('zh_en'); 中英文对照map.setLang('zh_cn'); 中文复制代码

移动与缩放事件

map.on('moveend', logMapinfo);map.on('zoomend', logMapinfo);复制代码

获取地图层级与中心点

var zoom = map.getZoom(); // 获取当前地图级别var center = map.getCenter(); // 获取当前地图中心位置复制代码

设置地图层级与中心点

map.setCenter([lng, lat]); // 设置中心点map.setZoom(zoom); // 设置地图层级map.setZoomAndCenter(zoom, [lng, lat]); // 设置地图层级与中心点复制代码

获取当前行政区

// 获取并展示当前城市信息function logMapinfo () {  /*     使用 map.getCity() 获取地图当前中心所在行政区    回调函数的参数 info 对象拥有四个属性    province, city, citycode 城市编码, district 区    new PrettyJSON.view.Node() 接受一个参数对象渲染视图：      el 指定渲染的元素,      data 指定渲染的数据   */  map.getCity(function (info) {    var node = new PrettyJSON.view.Node({      el: document.querySelector('#map-city'),      data: info    });    console.log(info);  });}logMapinfo();map.on('moveend', logMapinfo);复制代码

设置地图当前行政区

map.setCity(城市名)

function gotoCity() {  var val = document.querySelector('#city-name').value; // 可以是 cityname, adcode, citycode  if(!val) {    val = '北京市';  }  map.setCity(val);  log.info(`已跳转至${val}`);}// 绑定查询点击、回车事件document.querySelector('#query').onclick = gotoCity;复制代码

获取并设置边界坐标

获取

var bounds = map.getBounds();document.querySelector('#ne').innerText = bounds.northeast.toString();document.querySelector('#sw').innerText = bounds.southwest.toString();复制代码

设置

// 通过 new AMap.Bounds(sourthWest:LngLat, northEast:lngLat)// 或者 map.getBounds() 获得地图 Bounds 信息var mybounds = new AMap.Bounds([116.319665, 39.855919], [116.468324,39.9756]);map.setBounds(mybounds);复制代码

限制地图显示范围

// 限制map.setLimitBounds(bounds);// 取消map.clearLimitBounds(bounds);复制代码

地图的平移

// 平移map.panBy(50,  100);// 移动到中心点map.panTo([116.405467, 39.907761]);复制代码

地图的交互

var mapOpts = {  showIndoorMap: false, // 是否在有矢量地图的时候自动展示室内地图，PC默认true, 移动端默认 false  resizeEnable: true, // 是否监控地图容器尺寸变化，默认值为 false  dragEnable: false, // 地图是否可通过鼠标拖拽平移，默认为 true  keyboardEnable: false, // 地图是否可通过键盘控制，默认为 true  doubleClickZoom: false, // 地图是否可通过鼠标双击放大地图，默认为 true  zoomEnable: false, // 地图是否可缩放，默认值为 true  rotateEnable: false, // 地图是否可旋转，3D视图默认为 true, 2D视图默认 false};复制代码

// 通过map.setStatus 方法动态设置地图状态map.setStatus({  dragEnable: true,  keyboardEnable: true,  doubleClickZoom: true,  zoomEnable: true,  rotateEnable: true});复制代码

获取鼠标点击经纬度

map.on('click', function (e) {  document.getElementById('lnglat').value = e.lnglat.getLng() + ',' + e.lnglat.getLat();});复制代码