百度地图 |
您所在的位置：网站首页 › 百度地图的设置在哪 › 百度地图 |
百度地图
|
前面在创建地图实例后，对其进行初始化时，调用了BMap.Map.centerAndZoom()方法，该方法接收两个参数：1、中心点坐标Point，2、地图缩放级别zoom(3-19级) 。这里第一次出现zoom。 ZOOM：地图缩放级别，即当前地图区域放大显示的级别，值为3到19的整数。数字越小，地图显示的范围区域越大，但比较模糊，只是一个区域概念，无法具体。反之数字越大，地图显示的范围区域越小，但更详细，更精确。 that.mapInstance.centerAndZoom( new BMap.Point(r.longitude, r.latitude), 13 // 这里的13就是初始化时设置的zoom ); // 地图初始化,设置中心点坐标(本地)和地图缩放比例。Point也可以设定为一个固定值，如天安门()
1、获取当前ZOOM： // 获取地图当前缩放级别Zoom getZoom() { return this.mapInstance.getZoom(); // 前面地图初始化时已获取map实例(this.mapInstance)，故这里直接通过api获取 }
2、设置ZOOM： // 设置地图缩放级别Zoom setZoom(newZoom) { this.mapInstance.setZoom(newZoom); // 前面地图初始化时已获取map实例，故这里直接通过api设置。 // setZoom方法接受正整数(3~19)或小数(3.0~19.0)，虽然接受小数，实际上是取了整的，按整数设置。故最好输入正整数 },
3、总结：实际开发过程中，可能不会如此单调的直接调用两个API，更多的估计是通过这两个API进行地图适度的放大和缩小，如：搜索某具体地址时，通过给zoom设置一个较大值，从而将地图放大，以求显示得更精确；同理在搜索一个较大区域时，将zoom值变小，从而使得地图可以显示更大的区域。
组件源码备份： 设置级别 放大一级 缩小一级 获取当前ZOOM 当前地图缩放级别为： {{ currentZoom ? currentZoom : "" }} export default { name: "mapZoom", props: { mapInstance: { type: Object, required: true, default: () => { return {}; } } }, data() { return { ruleForm: { mapZoom: null }, currentZoom: null }; }, methods: { // 设置地图缩放级别Zoom setZoom(type, zoom) { let newZoom = 0; switch (type) { case "amplification": { newZoom = this.getZoom() + 1; break; } case "narrow": { newZoom = this.getZoom() - 1; break; } case "setZoom": { if (zoom) { newZoom = Number(zoom); } else { return; } break; } } this.currentZoom = null; this.mapInstance.setZoom(newZoom); // 前面地图初始化时已获取map实例，故这里直接通过api设置。 // setZoom方法接受正整数(3~19)或小数(3.0~19.0)，虽然接受小数，实际上是取了整的，按整数设置。故最好输入正整数 }, // 获取地图当前缩放级别Zoom getZoom(type) { let tempZoom = this.mapInstance.getZoom(); // 前面地图初始化时已获取map实例(this.mapInstance)，故这里直接通过api获取 if (!type) { return tempZoom; } else { this.currentZoom = tempZoom; } } } }; .el__form-queryPar >>> .el-form-item__content { width: 100%; } .queryPar-button-wrapper, .font-size16 { margin-top: 10px; } |
，若后续地图操作和交互中并未修改过zoom值，则此时获取的zoom为地图初始化时的zoom。修改过的zoom值，则获取的是修改过后的值。
【本文地址】
今日新闻 |
推荐新闻 |