关于百度地图开放平台api覆盖物“自定义Marker图标”不能正常显示的解决方案

news2024/9/24 5:28:14

“自定义Marker图标”不能正常显示(用网上图片能正常显示,用本地图片就不能显示),
分两种情况:
1.网上图片,往往是图片的url地址有问题,也可能是url地址的图片失效了。
2.本地图片,这个有说需要用require包裹的,有说需要用import导入的,照着做了都没成功,最后是结合web页面控制台报错信息发现了问题所在:
CORS引起的
CORS(Cross-origin resource sharing) “跨域资源共享”
web页面中的报错如下:
报错1:from origin ‘null’ has been blocked by CORS policy
报错2:Failed to load resource: net::ERR_FAILED

个人理解就是,本地图片上传给 百度地图 api 时是不满足 跨域同源策略的,所以百度地图api尝试获取咱们的本地图片时被浏览器给阻挠了。
解决的办法如下:

通过拜读 楠鱼上青天 大神的文章,通过在 vscode中下载插件 live server ,通过 live server 打开 html页面,轻松解决问题,
大神文章如下,感兴趣的同学可以移步观看,记得给大神点赞呦。
在这里插入图片描述
大神文章链接:https://blog.csdn.net/weixin_45749480/article/details/119936038

在vscode 中使用 live server 插件的方法:
1.在vscode中安装 live server 插件,并开启 live server 服务
在这里插入图片描述
在这里插入图片描述

2.使用 live server 打开 目标 web html 页面
在这里插入图片描述
在这里插入图片描述
问题解决。

注意事项,本地图片若和 html 页面在同级目录下,直接写文件名即可,若不同级,则写相对路径,不要写绝对路径,绝对路径不好使。

may2023the07thSunday

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/498612.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

linux软件包管理和进程管理

目录标题 RPM管理工具rpm安装rpm查询功能rpm软件包升级、卸载 YUM管理工具建立本地光盘源配置互联网源yum工具管理软件包 ps指令动态查看进程top RPM管理工具 软件包(本地–网络)—安装(软件包)—卸载(软件&#xff0…

【Python】【进阶篇】24、Django if标签详解

目录 24、Django if标签详解1. 模板标签1) 判断逻辑的 if 标签 24、Django if标签详解 本节继续讲解 Django 的模板语言,Django 内置了许多标签用于简化模板的开发过程,同时 Django 也支持自定义标签,这极大的方便了 Web开发者,下…

拓展系统变量

文章目录 拓展系统变量 使用方式拓展系统变量获取服务端IP - $ZSERVERIP获取客户端IP - $ZCLIENTIP获取最大许可数量 - $ZMAXLICENSE获取当前系统名称 - $ZOSNAME获取字符串最大长度 - $ZMAXSTRINGLEN获取当前登录用户ID - $ZUSERID获取当前登录用户名 - $ZUSERNAME系统最近错误…

【Linux从入门到精通】C语言模拟实现进度条小程序

在Linux下,我们安装软件时会经常看到进度条,来告知我们安装的进度。我们不妨自己模拟实现一个进度条,看看其中的细节。模拟实现进度条并不困难,但其中的细节我们又不可忽视。本篇文章会对模拟实现进度条进行详解。 文章目录 一、进…

顺序表(数据结构)---排队啦!

目录 前言: 1.线性表的性质 2.静态数组or动态数组 2.1静态数组 2.2动态数组 3.结构体的创建 4*接口函数的详细讲解 4.1初始化结构体 4.2尾插 4.3打印数据 4.4用完后销毁创建的堆空间 4.5 尾删 4.6头插 4.7头删 4.8查找 4.9任意位置插入 4.10任意位…

springboot+jsp商务安全邮箱(源码+文档)

风定落花生,歌声逐流水,大家好我是风歌,混迹在java圈的辛苦码农。今天要和大家聊的是一款基于springboot商务安全邮箱。项目源码以及部署相关请联系风歌,文末附上联系信息 。 💕💕作者:风歌&…

谈谈Edge浏览器新出的分屏功能

谈谈Edge浏览器新出的分屏功能 前言 在 2023 年三月份微软为 Microsoft Edge 浏览器的稳定版本带来了一个新功能 —— 分屏浏览 (Split Screen),此功能允许用户在当前页面以左右视图的形式并排打开两个标签页面,作用上类似于应用的分屏可以让浏览器同时处…

Kali Linux部署qemu虚拟化启动img镜像文件

一、先下载最新版本的Kali环境 Kali Linux官网下载网址:Get Kali | Kali Linux 安装到VMware里面后,调整内存大小为4G(如果自己电脑内存32G的话,可以调整为8G) 更新一下Kali Linux源 然后安装如下软件 apt install qe…

二十九、交换机堆叠与集群

文章目录 堆叠技术概述一、可靠组网二、堆叠技术名称三、华为堆叠原理1、基本概念2、堆叠端口:(逻辑端口)3、堆叠拓扑类型4、堆叠硬件要求 四、堆叠配置示例(华三模拟器)1、sw1:2、sw2:3、激活i…

弹射起步——pythonweb开发Flask框架,前端原生+Flask后端框架+mysql数据库实战(附带小案例)

大家好,我是csdn的博主:lqj_本人 这是我的个人博客主页: lqj_本人的博客_CSDN博客-微信小程序,前端,python领域博主lqj_本人擅长微信小程序,前端,python,等方面的知识https://blog.csdn.net/lbcyllqj?spm1011.2415.3001.5343哔哩哔哩欢迎关注…

HCT:深度是我们没有的奢侈品

文章目录 Deep is a Luxury We Don’t Have摘要本文方法Efficient AttentionThe HCT Architecture Deep is a Luxury We Don’t Have 摘要 医学图像具有高分辨率。高分辨率对于早期发现恶性组织至关重要。然而,这一解决方案在建模长期依赖性方面提出了挑战。浅层t…

接口自动化测试的神器:使用Python编写高效的自动化测试工具

B站首推!2023最详细自动化测试合集,小白皆可掌握,让测试变得简单、快捷、可靠https://www.bilibili.com/video/BV1ua4y1V7Db 目录 摘要: 安装工具: 测试脚本 编写python脚本 1.使用requests发送HTTP请求 2.使用py…

生产环境出现CPU占用过高,请谈谈你的分析思路和定位

假如生产环境出现CPU占用过高,请谈谈你的分析思路和定位 记一次印象深刻的故障? 结合Linux 和 JDK命令一起分析,步骤如下 使用top命令找出CPU占比最高的 ps -ef 或者 jps 进一步定位,得知是一个怎么样的后台程序出的问题 定位…

夏驰和徐策的解决数学问题思路——反证法

反证法是一种证明方法,它的基本思路是通过假设某个结论不成立,然后构造出一个矛盾的情况来推导出原先假设的结论是成立的。 具体来说,反证法一般包含以下步骤: 1. 假设所要证明的命题不成立。 2. 通过这个假设,构造…

网易云音乐开发--个人中心页效果实现

内网穿透 就是我们真机调试,是没有数据的 就是我们手机上去访问我们电脑上自己搭的服务器,肯定是访问不到的 此时就需要我们内网穿透 1.winR 输入 cmd 输入ipconfig 2.找到无线局域网适配器的IPv4 3.重新设置一个新的地址,只需将host中…

Snipaste介绍、安装、使用技巧(截图贴图工具)

一、简介 Snipaste 是一个简单但强大的截图贴图工具,也可以让你将截图贴回到屏幕上!下载并打开 Snipaste,按下 F1 来开始截图,再按 F3,截图就在桌面置顶显示了。就这么简单! 你还可以将剪贴板里的文字…

HTMLCxx 编译说明

1、编译库 下载htmlcxx之后,打开项目编译工程: 双击编译之后,会出现错误: 此时,双击定位到错误的位置: 去掉双引号,重新输入 "",编译通过 2、引用库解析数据 这时候会定位到当前的错…

双目测距--3 双目标定

目录 -1 流程说明: 0 几个重要 函数 1、calibrateCamera()函数 2、stereoCalibrate() 3、findChessboardCorners() 棋盘格角点检测 4、stereoRectify() 5、initUndistortRectifyMap() 6、remap() 1、用于标定的图像 2、标定前 3、OpenCV进行双目标定 单…

《基于多尺度特征提取的少样本脉搏波形轮廓分类》阅读笔记

目录 一、论文摘要 二、论文十问 Q1:论文试图解决什么问题? Q2:这是否是一个新的问题? Q3:这篇文章要验证一个什么科学假设? Q4:有哪些相关研究?如何归类?谁是这一课…

【c++】——string类

🌱码云:一条咸鱼 目录 🍉string类简介🍉string类的常用接口说明🍓string类对象常见构造函数🍓string类对象常见容量操作函数🍓string类对象访问及遍历操作函数🍓string类对象修改操作…