高德地图缩放地图时覆盖物标点偏移问题

最新推荐文章于 2025-03-19 22:18:40 发布
最新推荐文章于 2025-03-19 22:18:40 发布
阅读量3.2k 收藏 5
点赞数 3
分类专栏： 随笔手记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/AillenRen/article/details/109307999
版权
本文探讨了高德地图中图标标记随地图缩放发生偏移的问题，并提出了解决方案：通过设置offset属性来确保标记位置准确，即使偏移为0也需要进行配置。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

虽然高德地图用了很多了，不过一直没在意的一个问题，今天又出现了，让我费了一番脑筋。那就是打在地图上的覆盖物标点，随着地图缩放的时候，发生了偏移。本来在路这边的标点，缩放以后，可能就显示到路对面去了。
以前基本都是用的气泡标记，这次试用的原型图标，所以 anchor 也设置成了 center，理所当然的去掉了offset 配置。结果就出现这个问题了。所以说，为了让标记点不“漂移”，还是需要加上 offset 属性。
在这里插入图片描述
即使偏移为0，也要这样设置一下。做个笔记，免得哪天又忘了

解决百度地图的父元素出现滚轮之后启用鼠标缩放模式之后出现偏移的现象
weixin_61468054的博客
06-29 1885
百度地图的父元素出现滚动条 鼠标缩放出现偏移
高德地图实现绘制覆盖物，自定义右键菜单
02-26
本项目聚焦于利用高德地图js-api实现绘制覆盖物，以及自定义右键菜单的功能。 首先，我们来探讨“绘制覆盖物”这一概念。在高德地图API中，覆盖物是指可以在地图上绘制的各种图形，如点、线、面等。在这个项目中，...
高德地图自定义标记点marker缩放偏移问题
weixin_43180359的博客
06-13 7368
在使用高德地图点标记功能，自定义图标或内容时，如果对地图进行缩放，可以发现会此时图标会存在偏移，定位不准现象，如下图造成这种现象的原因其实是对标记点的偏移量offset属性理解不准确导致，通过查阅官方文档可知，offset默认值是[0,0]，意思就是定位中心点是在图标的左上角，带着此种思维再去看刚才的效果就可以发现，其实是没有偏移的，只是图标定位点在底部，缩放时造成的视觉上错觉，如下图我们可以看到，如果把视觉焦点聚焦在左上角[0,0]的位置，其实定位一直是准确的。造成这种误导还有个原因就是当我们使用高德默认
实现高德地图自定义点标记跳动，点标记随缩放大小显示和隐藏
最新发布
youmyangel的博客
03-19 478
高德地图的自定义标记（Marker）添加一个循环动画效果，比如让图标上下跳动，你可以利用 CSS 动画或 JavaScript 动画库（如GSAP）。使用 GSAP 来创建动画，下面我将展示两种GSAP 和 CSS 类来为 Marker 的内容添加循环动画。首先自定义点标记，在点标记显示内容content中自定义一个图标，这里我用的是element中的图标，给标签一个类名，如i-icon。还是和上述方法一中一样，先自定义点标记。在初始化地图时，监听地图缩放事件，根据缩放级别隐藏或显示点标记。
高德地图定位点缩放偏移问题
shi19970609的博客
05-11 646
new mapObj.AMap.Pixel(-38, -40), x设置图片一半的负值 y设为高的负值。
高德地图点标记随着地图放大缩小位置改变的解决办法
weixin_43791884的博客
01-13 2849
高德地图点标记随着地图放大缩小位置改变的解决办法
高德地图纠偏 php,高德地图开发中,缩放后Marker偏移的问题
weixin_35663823的博客
04-10 768
最近在做地图开发，遇到一个小坑，记录在这里。按照高德地图的文档，初始化Marker(图标)并将其放置到地图上，示例如下：var marker = new AMap.Marker({icon: "http://www.easyicon.net/api/resizeApi.php?id=1185658&size=32",position: [120.1, 30.1]});本以为就可以这样简简单...
AmapOverLayDemo:高德地图覆盖物完全解析
05-15
高德地图覆盖物完全解析 由于项目要求，对地图覆盖物需求点击，所以选择marker作为覆盖物主题 起初也为marker要满足设计复杂的图形而苦恼，直到发现sdk中的这个接口 BitmapDescriptor markerIconWoman = ...
高德地图定位、周边搜索、位置弹框、添加覆盖物等功能
09-07
本项目聚焦于“高德地图定位、周边搜索、位置弹框、添加覆盖物”等核心功能，允许开发者实现自定义定位、覆盖物管理以及交互事件处理，从而创建出更加个性化的地图应用。 首先，高德地图的定位功能是基础，它能够...
基于Java的traccar平台高德地图适配版定位偏移修正源码
10-06
本文介绍的项目是一个基于Java的Traccar平台适配高德地图的版本，主要功能是校正GPS定位偏移问题。项目代码包内共有1509个文件，包含了多种类型的文件，主要有Java源文件、虚拟机（VM）文件、XML文件、Python脚本、...
百度地图偏移，高德地图偏移的解决方法
05-27
百度纠偏 高德纠偏 地图纠偏 地图偏移
地图缩放后Marker偏移的问题
weixin_30532987的博客
10-08 2046
最近在做地图开发，遇到一个小坑，记录在这里。 按照高德地图的文档，初始化Marker(图标)并将其放置到地图上，示例如下： var marker = new AMap.Marker({ icon: "http://www.easyicon.net/api/resizeApi.php?id=1185658&size=32", position: [120....
Vue项目大屏可视化适配 transform+解决高德地图经纬度偏移
qq_45642765的博客
07-27 5357
vue js大屏适配 transform 方法+解决高德地图经纬度偏移问题
高德地图缩放marker位置变化，及设置offset偏移
mrsun_web
10-15 8408
一些朋友在往地图上添加标注的时候，往往会发现，图片的尖尖角对不上具体的点。比如，我要在上海东方明珠上扎一个点。 var marker = new AMap.Marker({ //添加自定义点标记 map: map, position: [121.499809,31.239666], //基点位置 offset: new AMap.Pixel(0, 0), //相对于基点的偏移位置 draggable: true, //是否可拖动
高德地图，伸缩导致图标偏移问题
shua_1990的博客
07-04 1049
比如：上面图片尺寸是50*50；那么下面offset的值是 x轴是-(50/2)，Y轴是50。设置定位图标，在伸缩的时候，会导致定位点的图标出现偏移；这样就在地图伸缩的时候 图标不会跟着偏移。设置marker里面的offset偏移量。值的计算：icon里面image图标尺寸。
【高德地图】缩放后marker偏移，怎样移到准确位置
热门推荐
牛哞哞杂记
08-22 1万+
背景描述： 最近使用高德地图，做数据展示功能。用到海量点，可以查看这里 类似下图的效果： 遇到的问题： 因为将标点改成了自定义的图标，就发现标点的位置偏移了，比如，本来这个标点应该在“三亚”，但是显示在地图上时，却到了海里，放大缩小地图时，感觉标点位置也会变。 原因： 查看高德API可知，通过设置 offset 来添加偏移量，当偏移量为 (0, 0) 时，自定义图标默认以左上角为基准点。 而造成在地图上缩放，标点位置会偏差就是偏移量设置有误造成的。 我需要将标点中心位置设置在底部中间（下图黄点位置），所以
高德地图scale缩放后地图上标记点位置偏移错位无法点击
qq_48627829的博客
11-28 2319
高德地图模式默认为2D模式 将viewMode设置为3D即可解决无法点击问题。
openlayers,ol-map,transform:scale(),地图实例等比缩放时,元素偏移问题
Hello.DingPeng的博客
07-12 2629
我在做可视化页面中,使用transform:scale来进行页面的等比例缩放,其中地图区域使用openlayers作为地图模块,之后出现了图层上feature元素发生实际位置与显示的位置不符,具有一定的偏差。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值