拉框缩放 AMap.MouseTool 最后更新时间: 2024年02月26日

1.1 准备

1.2 创建地图

const map = new AMap.Map("container", {
  zoom: 10, //地图级别
  center: [116.397428, 39.90923], //地图中心点
  mapStyle: "amap://styles/whitesmoke", //设置地图的显示样式
  viewMode: "2D", //设置地图模式
});

1.3 创建 MouseTool 实例

本例使用异步安装插件。通过AMap.plugin方法按需引入插件，在plugin回调之后使用插件功能。插件引入方式 插件的使用。

AMap.plugin("AMap.MouseTool", function () {
  var mouseTool = new AMap.MouseTool(map); //创建鼠标工具插件实例
});

1.4 放大

//在回调函数中使用插件功能
mouseTool.rectZoomIn({
  strokeColor: "#80d8ff",
  fillColor: "#80d8ff",
  fillOpacity: 0.3,
  //同 Polygon 的 Option 设置
});

1.5 缩小

//在回调函数中使用插件功能
mouseTool.rectZoomOut({
  strokeColor: "#80d8ff",
  fillColor: "#80d8ff",
  fillOpacity: 0.3,
  //同 Polygon 的 Option 设置
});

1.6 关闭拉框缩放

//在回调函数中使用插件功能
mouseTool.close();