百度地图开发打开窗口没有关闭按钮，默认marker标记较小问题解决

最新推荐文章于 2022-03-28 22:35:45 发布
最新推荐文章于 2022-03-28 22:35:45 发布
阅读量884 收藏
点赞数
分类专栏： 百度地图开发 文章标签： 百度地图 关闭按钮 marker较小 样式问题
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zf2014122891/article/details/103453369
版权
在百度地图开发中遇到标记点过小和弹出窗口无关闭按钮的问题。通过为地图宿主元素添加特定样式类，成功解决了这两个样式问题，使得标记更明显，窗口操作更便捷。
摘要由CSDN通过智能技术生成

问题描述

在开发百度地图的过程中，发现在地图上显示的标记点较小，并且绑定的点击打开窗口事件，触发后弹出的窗口没有关闭按钮，如下图：
错误图片显示

问题解决

在百度地图宿主元素上，添加一个google-maps样式类：

    <div #lineMonitorMap id="lineMonitorMap-v2" 
    style="hei
最低0.47元/天 解锁文章
rookieLink
关注
专栏目录
matlab从无到有系列（六）：高级图形处理功能（多窗口绘图以及花瓶绘制）
左手の明天的博客
03-27 8605
🔗 运行环境：Matlab 🚩 作者：左手の明天 🥇 精选专栏：《python》 🔥 推荐专栏：《算法研究》 📚 选自专栏：《数学建模》 🧿 优秀专栏：《Matlab神经网络案例分析》 目前持续更新的专栏： 🥇 专栏：Matlab GUI编程技巧 🔥 专栏：Matlab从无到有系列 📚 专栏：《数学建模》 大家好，我是左手の明天！ Matlab句柄绘图 Matlab语言的句柄绘图可以对图形各基本对象进行更为细腻的修饰，可以产生更为复杂的图形，而且为动态图形的制作奠定了基础。 高层.
可视化绘图技巧100篇进阶篇（十一）-带平滑线和标记的散点图
最新发布
getusushu的博客
08-30 445
带平滑线和标记的散点图是一种数据可视化图表，通常用于展示两个变量之间的关系和趋势。它结合了散点图和平滑曲线的特点，使得数据的分布和变化趋势更加直观地呈现。
百度地图点聚合中marker的infowindow消失的问题
ztop_f的博客
03-22 1万+
目前的业务场景是：地图中有多个点的点聚合，聚合点展开后，每个marker有自己的点击事件，点击时显示窗口信息。 做法是marker.openInfoWindow(infowin); 问题来了，每次点击时地图会自动将窗口平移到地图中心，这时窗口就消失了。 后调查发现，地图平移，缩放等操作会触发点聚合的重绘制事件，重绘时markers中没有保存infowindow等信息，所以会被覆盖掉。 尝试
百度地图标注图标太小
weixin_34273479的博客
05-20 893
1.1.1 现象 百度地图中，定位点的标注示意图标太小： ...
HTML5学习---百度地图修改Marker图标大小的方法
热门推荐
啊哈程序
04-25 4万+
var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), { offset: new BMap.Size(10, 25), imageOffset: new BMap.Size(0, 0 - index * 25) }); var mar
【百度地图】BMapLib的infoBox窗体关闭按钮在移动端点击失效问题解决
wan小小冰的博客
05-29 4323
BMapLib库的窗体自定义的关闭按钮在移动端由于阻止了其冒泡事件，在窗体中的点击事件都不生效，现在自己定义一个新的关闭按钮对其进行监听，利用touchend事件关闭窗体； 一、JS代码 //定义窗口内容 var info = &amp;amp;quot;&amp;amp;amp;lt;div class='plat-box qypopup'&amp;amp;amp;gt;&amp;amp;quot; + &amp;amp;quot;
html更改地图放大缩小图标,HTML5学习---百度地图修改Marker图标大小的方法
weixin_33371495的博客
06-04 2102
var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {offset: new BMap.Size(10, 25),imageOffset: new BMap.Size(0, 0 - index * 25)});var marker = new BMap.Marke...
Android 仿百度地图气泡程序源码.rar
12-03
在Android开发中，创建类似百度地图的气泡（InfoWindow）效果是一项常见的需求，它可以用于显示地图上的标记点详细信息。这份"Android 仿百度地图气泡程序源码"提供了实现这一功能的具体代码，帮助开发者快速集成并...
前端面试问题（适用于面试回答思路）
yaminne的博客
03-28 5021
原型和原型链 原型：构造函数的 prototype 属性指向了一个对象，这个对象正是调用该构造函数而创建的实例的原型。也即，每个构造函数的实例都有一个原型，叫原型对象，由实例对象的内置属性_proto_指向。每个原型都有一个 constructor 属性指向关联的构造函数。 原型用法：构造函数创建的实例可以访问实例的属性和方法，也可以访问原型的属性和方法。对于原型只能访问自己的属性和方法。考虑这一特性，如果对象公有的属性和方法，我们可以添加到原型上面，对象需要的时候直接访问原型的属性和方法就可以。 当读取实
vue cli 调取百度地图使用自定义弹框BMapLib.InfoBox（） 创建的弹框默认关闭按钮如何隐藏
rpf1234的博客
06-07 1448
vue cli 调取百度地图使用自定义弹框BMapLib.InfoBox（） 创建的弹框默认关闭按钮如何隐藏 代码如下 index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=1920,initial-scale=1.0"/> <title>zhihuixunhe&
地图-百度地图、高德地图默认定位，点击标记mark
kinghuahua
07-01 1087
高德地图 <!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width"> &l
百度地图实现标注点Marker的Label点击Marker显示再次点击Marker关闭的toggle效果
weixin_30920853的博客
02-27 722
网上搜索了一下，发现没能找到类似的效果，查百度地图API也没能找到，可能是我没找到，于是自己用一种方式实现了。在此记录一下。首先需要给marker设置一个点击事件。在点击事件里调用marker的getLabel方法，判断marker有没有Label，第一次点击的时候，控制台打印的是null，这个时候需要生成一个Label放到marker上。接着点击marker判断，此时Label不是nu...
百度地图API取消点击景点弹出框
ccyy
10-19 2294
有时候我们自己在地图上添加的标注会跟百度地图上面的景点商家标注重合。点击的时候就会弹出景点弹窗。 就像这样： 我们正常在创建地图的时候都是： var map = new BMap.Map("allmap"); // 创建Map实例 想要禁用百度地图景点弹窗需要添加点东西： var map = new BMap.Map("allmap", { enableMapClick: false }); // 创建Map实例 增加 { enableMapClick: false }配置项即
一个简单的动态关闭DIV框的效果，带关闭按钮
战斗机
07-14 1791
jquery设置获取div位置 var top=obj.offset().top; var left=obj.offset().left; $("#mapDiv").css({'top':top-20,'left':left+50}); [code="html"] New Document function closer...
vue正确使用百度地图的方案
weixin_42471170的博客
04-25 480
方案一： 1.在index.html，加入 2.在vue.config.js，配置 configureWebpack: config => { config.externals = { ‘BMap’: ‘BMap’ } } 3.在Address.vue页面 import BMap from ‘BMap’ export default { methods: { initMap () { var map = new BMap.Map(‘container’) //创建地址解析器实例 var m
百度地图Marker点 缩放图标移动问题
小小子的博客
03-29 9047
1.首先你要知道marker在地图上是在一个图层上的，与地图是无关的，就像在手机屏一样，你的marker是放在外屏上的，不论你怎么操作内屏的内容，与外屏上的裂纹是无关的。在百度地图中Marker点最下方不是尖头的会出现在地图放大缩小时 感觉Marker好像定位点是会变的，据我项目中分析是百度地图设置marker 时 就是中心点是在以marker点的图标所构成长方形的底边中心点上的，最终你在缩放时，...
百度地图 JS API 隐藏信息弹窗自带的关闭按钮
weixin_43422861的博客
02-19 1881
var infoWindow = new BMap.InfoWindow(appendDiv); // 创建信息窗口对象 infoWindow.addEventListener('open',function(type, target, point){ //窗口打开是，隐藏自带的关闭按钮 $('.BMap_pop>img').hide(); })
百度地图 JS API 隐藏信息弹窗自带的关闭按钮
kylvia的专栏
03-01 1万+
隐藏信息弹窗自带的关闭按钮var infoWindow = new BMap.InfoWindow(appendDiv); // 创建信息窗口对象 infoWindow.addEventListener('open',function(type, target, point){ //窗口打开是，隐藏自带的关闭按钮 $('.BMap_pop>img').hide(); })
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值