百度地图缩放拖拽后视图偏移、漂移的问题

最新推荐文章于 2023-05-20 14:24:10 发布
最新推荐文章于 2023-05-20 14:24:10 发布
阅读量2.2k 收藏
点赞数
分类专栏： 前端 baidu-map-vue 文章标签： 百度地图偏移
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41656074/article/details/102754813
版权

左右偏移严重，经过排查发现是由于地图模块为非第一个tabPane造成的，使用的是ivew的tab组件，默认开启了动画效果，动画效果是左右滑动效果，和百度地图的缩放拖拽冲突了（谷歌地图无此问题）。

解决方法：

1.将地图模块的tabPane移动到tab内的第一个，但业务需求不允许我这样做，所以用第二个方法

2.将tab组件的动画关闭...

SyronChoo
关注
专栏目录
解决百度地图的父元素出现滚轮之后启用鼠标缩放模式之后出现偏移的现象
weixin_61468054的博客
06-29 1570
百度地图的父元素出现滚动条 鼠标缩放出现偏移
transform导致百度地图缩放发生偏移解决方案
weixin_51609337的博客
06-07 1195
试了很多种方法都无效，最终是把地图提取出来，新建一个html文件，然后用iframe标签来引用新的页面，这样的话地图进行鼠标缩放的时候，就不会发生偏移了。制作可视化大屏的时候，会用到transform来实现自适应，那么就导致了地图缩放时发生偏移，体验感很差。
百度地图自定义坐标标识覆盖物，随地图缩放偏移解决办法
木与石
03-17 1万+
百度地图在添加自定义标注的时候可能会遇见坐标标识，随着地图缩放位置产生偏移，我折腾了一个上午，记下这篇。
百度地图处理地图缩放出现中心点偏移的bug
TianYu0-0的博客
03-24 3830
百度地图处理地图缩放出现中心点偏移的bug 问题 百度地图的未放在标准文档流中，地图缩放出现中心点偏移。 出现原因 百度地图加载的位置因为定位等原因，与整个html 页面产生了不同步滚动的问题。百度地图的缩放是基于body层的，如果body层有滚动条，并且不在最顶端，在当前位置插入了百度地图，也就是出现该问题时的状态，这个时候滚轮缩放就会产生偏移。 解决方案 主要是通过监听到缩放开始事件来获取缩放前的中心点经纬度，然后监听到缩放结束事件后，将地图重新位移到缩放之前的中心点处。 vue代码如下： <t
百度地图自定义覆盖物，随地图缩放、拖曳偏移解决办法
weixin_44788637的博客
04-20 1302
如图所示，需要在定义的元素上添加position: absolute属性。
地图缩放后Marker偏移的问题
weixin_30532987的博客
10-08 1955
最近在做地图开发，遇到一个小坑，记录在这里。 按照高德地图的文档，初始化Marker(图标)并将其放置到地图上，示例如下： var marker = new AMap.Marker({ icon: "http://www.easyicon.net/api/resizeApi.php?id=1185658&size=32", position: [120....
百度地图偏移，高德地图偏移的解决方法
05-27
高德地图和百度地图作为两大主要的地图服务提供商，对于地图偏移的问题也有着不同的解决方法。 什么是地图偏移？ 地图偏移是指由于坐标系的不同和数据采集方法的差异，导致地图上显示的坐标点与实际坐标点之间存在...
Echarts的地图实现拖拽缩放同步功能（解决多层geo缩放、拖动卡顿问题）
最新发布
06-14
Echarts的地图实现拖拽缩放同步功能（解决多层geo缩放、拖动卡顿问题），大屏项目显示云南省3D的地图，可拖拽缩放、地图打点、点击图标弹框等等功能。 ## 使用 - 启动调试服务: `npm start` - 构建 dist: `npm run ...
比例尺、缩略图、平移缩放之百度地图添加控件方法
09-03
本文将详细讲解如何在百度地图中添加比例尺、缩略图、平移缩放等控件，并介绍相关配置方法。 首先，百度地图API提供了多种内置控件，包括NavigationControl（平移缩放控件）、OverviewMapControl（缩略图控件）、...
js百度地图放大缩小拖拽查看效果
10-27
在JavaScript（js）编程中，实现百度地图的放大、缩小和拖拽查看功能是一项常见的需求。这涉及到对百度地图API的深入理解和应用。百度地图API是百度提供的一套用于开发地图应用的JavaScript库，它允许开发者在网页上...
百度地图初始化时中心和标志漂移
u014029833的博客
07-31 449
项目中用到百度地图JsAPI遇到的问题。 定位到问题是加载地图的view在加载之前是hide，就算加载之前就show出来，还是会一定几率出现漂移，应该是百度地图没判断好view的宽高。 解决问题的方法是这里提供的： https://blog.csdn.net/zhujianli1314/article/details/45696259 1.是等地图加载完成再定位中心点，定位中心点的方法写在...
百度地图滚轮缩放产生位置偏移
m18066975852的博客
06-18 1385
当页面有滚动，当前页面不在页面最上方时，会导致此问题，解决方法如下。 //打开地图前调用 mapOpen(){ this.top = this.getScrollTop() if (this.top) { this.setScrollTop(0) } }, //关闭地图后调用 mapClose() { this.setScrollTop(this.top); this.top =...
前端中加载百度地图，地图容器绝对定位，地图缩放中心点偏移的处理
qq_21895591的博客
01-12 3625
var phone={ enableMessage:false} var map1 = new BMap.Map(&quot;allmap&quot;); map1.centerAndZoom(new BMap.Point(116.404, 39.915), 9); var point1 = new BMap.Point(116.404, 3...
百度地图上marker点发生偏移
KingRules的博客
12-22 2131
我们是后端返回的具体的位置信息，然后在百度地图上读取的时候不能把具体的坐标读取完全（返回130.2555555555）地图控件读取的时候是(120.2555),解决办法就是直接给marker点新增一个对象 // 向marker中存储数据 this.editMk.item = e // marker标记点坐标 this.poleList.forEach(e => { this.editPoint = new BMap.Point(e.lng, e.lat) // 添加marker
百度地图滚轮缩放，所在点偏移问题
weixin_33898233的博客
08-29 2512
提出问题 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=n...
百度地图滚轮缩放时基点偏移问题 - 非滚动条造成
fjl724619679的博客
05-20 614
观察发现加载百度地图的弹窗，是使用定位让弹窗居中的，当定位的top和left设置成0（即：弹窗定位到左上角）之后，百度地图的滚轮缩放的基点就会正常。重写了弹窗的样式，去掉弹窗的定位，使用flex弹性布局使弹窗居中，完成之后弹窗还是居中的，鼠标滚轮缩放地图基点也不会偏移。最近Web端项目中使用到了百度地图，地图上用鼠标滚轮进行缩放时，但是我的地图是在弹窗中使用的，并没有滚动条，上述的方法没法解决。这个解决办法也会出现一个问题，就是弹窗没法再进行拖拽了；
谷歌地图 new AMap.Marker 创建标记点 缩放后 位置偏移 解决方案
OOObject的博客
03-02 3884
谷歌地图 new AMap.Marker 创建标记点 缩放后 位置偏移 解决方案 按照高德地图的api，创建Marker(图标)并将其放置到地图上，代码如下： var marker = new AMap.Marker({ //设置经纬度 position : [121.499809,31.239666], //设置偏移量 offset: new AMap.Pixel(-10, -10), //设置图标属性 icon :
百度地图滚轮缩放产生位置偏移的解决办法
前端一线搬运工的博客
09-03 5361
查了全网并没有任何解决办法, 但是有一段话引起我的注意: 百度地图的缩放是基于body层的. 随后阅读地图源码发现: 地图定位确实是基于body层做计算, 所以你的地图如果出现这个问题, 十之八九脱离了标准文档流; 解决办法: 让百度地图加载在body滚动中, 不要加载在某个带有滚动条的''容器''里面(既地图放在CSS标准文档流中); 拓展: 1.Document.body.scrollTop为0的原因 2.Element.getBoundingClientRe...
网页使用百度地图后，显示不全（已解决）
热门推荐
onlyhom's notebook
01-18 2万+
网页加入百度地图后，显示不全地图是用百度地图生成器生成的： 百度地图生成器地址：http://api.map.baidu.com/lbsapi/creatmap/直接粘贴过来的代码，放到一个空白的新网页中是正常的 但是放到自己的网页中，就会显示不正常，如下图错误原因分析：发现在CSS中有一句（是用来防止容器中所有图片宽度超过父容器宽度而设置的）：.container img { max-
js百度地图缩放偏移
05-26
在使用百度地图时，缩放地图可能会出现偏移的问题。这通常是因为地图容器的大小改变了，但是地图的中心点没有改变。可以通过以下方法解决这个问题： 1. 在地图缩放之前，先获取当前的地图中心点坐标。 ``` var center = map.getCenter(); ``` 2. 缩放地图后，重新设置地图中心点坐标。 ``` map.setCenter(center); ``` 这样就可以避免地图缩放后出现偏移的问题了。如果还有其他问题，可以提供更详细的信息，我会尽力帮助解决。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值