首页 > 解决方案 > Vue谷歌地图缩放自动改变?

问题描述

我在别人的项目上工作,却错过了一件我的事!

这个项目很大,所以我只需要最基本的,就是使用https://www.npmjs.com/package/vue2-google-maps和 vuejs。

使用模块 gmap 是这样做的:

<gmap-map :center="mapCenter" :zoom="16" ref="gmap"
 :options="mapOptions" map-type-id="roadmap" class="gmap__map">
</gmap-map>

在那之后结束一个函数做一些参数,但我把它留空,因为这是我的观点:

this.$refs.gmap.$mapPromise.then(map => {
 console.log(this.$refs.gmap.zoom)
 console.log(this.$refs.gmap.$mapPromise.zoom)
})

第一个结果是 16,因为在组件中设置为 16 非常合乎逻辑!

:zoom="16"

但是第二个变化!它会根据地图上显示的内容正确更改。有我的问题,我搜索了很多,没有找到为什么在这两个步骤中缩放改变和正确改变!

我不知道为什么,而且这个项目真的很大,所以如果你不明白我的问题很简单。

如果默认缩放为 16,可以更改谁?(而且它不是与 map.setZoom())组件通过这个承诺($mapPromise)自动缩放变化?

非常感谢您的时间!

标签: javascriptvue.jsgoogle-maps

解决方案


我资助那个 coderwall.com/p/hojgtq/auto-center-and-auto-zoom-a-google-map

就是这样:map.fitBounds(bounds);

因此,经过大量小时后,此文档在五分钟内解决了问题!我希望它对某人有帮助


推荐阅读