漏刻有时百度地图API实战开发(7)个性化地图加载瓦片空白和Echarts加载bmap元素跟踪重影

在这里插入图片描述

一、地图瓦片加载缓慢或者空白

在使用百度个性化地图时,出现地图瓦片加载缓慢或者空白

解决方案

1.替换百度地图API引入方式

<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=I2428Rc4FDz00LSGUYfISLcbPsxOfjxl"></script>

改为:

<script type="text/javascript" src="https://api.map.baidu.com/getscript?v=3.0&ak=I2428Rc4FDz00LSGUYfISLcbPsxOfjxl"></script>

2.解决Mixed Content

Mixed Content: The page at ‘’ was loaded over HTTPS, but requested an insecure script ‘’. This request has been blocked; the content must be served over HTTPS.

参见:《Mixed Content: The page was loaded over HTTPS, This content should also be served over https解决方案》

在这里插入图片描述

二、bmap地图元素鬼影重重

百度地图和Echarts使用bmap组件时,元素不跟随,出现鬼影。

解决方案

匹配对应的对应版本的echarts.min.js和bmap.min.js版本即可。

    <script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.min.js"></script><script type="text/javascript" src="https://api.map.baidu.com/getscript?v=3.0&ak=I2428Rc4F**"></script><script type="text/javascript" src="https://fastly.jsdelivr.net/npm/echarts@5.4.3/dist/extension/bmap.min.js"></script>

三、个性化地图版本

版本说明
JavaScript API支持的个性化地图服务有两个版本,旧版个性化地图服务(Map.setMapStyle接口)已经不再更新。本文介绍新版本个性化地图服务(Map.setMapStyleV2接口)的使用方式。

1.两个版本的区别如下表所示:

在这里插入图片描述

bmap加载个性化地图的方式

1. bmap加载

 bmap: {center: [113.328755, 23.135588],zoom: 17,roam: true,mapStyle: {}}

2. 百度地图接口加载

        // 百度地图接口对接设置;var map = myChart.getModel().getComponent('bmap').getBMap();// 地图自定义样式map.setMapStyle()

@漏刻有时

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

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

相关文章

.NET 8 发布!

作者&#xff1a;Gaurav Seth 排版&#xff1a;Alan Wang 请立即下载 .NET 8&#xff01; 我们很高兴地宣布从今天开始 .NET 8 正式发布&#xff0c;它是世界领先的开发平台之一的最新 LTS 版本。.NET 8 提供了数以千计的性能、稳定性和安全性改进&#xff0c;以及平台和工具增…

中学老师求职简历(精选9篇)

以下简历内容以中学老师招聘需求为背景&#xff0c;我们整理并修改了9篇全面、专业且具有参考价值的简历案例&#xff0c;大家可以灵活借鉴&#xff0c;希望能帮助大家在众多候选人中脱颖而出。 中学老师简历下载&#xff08;可在下制作下载&#xff09;&#xff1a;百度幻主简…

抓取微信好友列表信息

本文实现的是一种较为安全、简洁、高效的抓取微信好友信息的方法。 实现工具&#xff1a;微信pc端、影刀RPA 主要流程&#xff1a; 手动—前期准备&#xff0c;电脑登陆微信&#xff0c;打开联系人页&#xff0c;使得联系人分类“A”显现在微信窗口界面 自动—运行程序&#…

JDK21无法导入TimeUnit类

运行环境&#xff1a;windows11、IDEA2023.1.3、JDK21 问题描述&#xff1a;IDEA中无法导入java.util.concurrent.TimeUnit类。 以下截图是问题解决后的截图。有问题的时候未截图&#xff0c;说明一下&#xff0c;有问题的时候TimeUnit类是红色的&#xff0c;无法导入&#x…

vue3中的provide与inject跨层级组件(祖孙)间通信

provide和inject提供依赖注入&#xff0c;功能类似 vue2.x 的provide/inject 实现跨层级组件(祖孙)间通信 子或孙子组件接收到的数据可以用于读取显示&#xff0c;也可以进行修改&#xff0c;同步修改父&#xff08;祖&#xff09;组件的数据。 注意&#xff1a;无论子组件…

python 使用reportlab打造29页图文并茂pdf(全网reportlab最强pdf自动化生成代码)

python 使用reportlab打造29页图文并茂pdf(全网reportlab最强pdf自动化生成代码&#xff09; 这次项目所使用的代码如果同志们可以灵活使用&#xff0c;基本上可以解决百分之九十以上的pdf模板自动化生成。 最近博主&#xff0c;做了一个项目&#xff0c;使用reportlab制作pd…

程序包不存在

idea2020会有一个小bug&#xff0c;在idea的Settings设置中进行下面配置&#xff1a; 然后在maven项目下的pom.xml中加入如下代码&#xff1a; <plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-surefire-plugin</artifact…

【趣味JavaScript】一文让你读懂JavaScript原型对象与原型链的继承,探秘属性的查找机制! 《重置版》

&#x1f680; 个人主页 极客小俊 ✍&#x1f3fb; 作者简介&#xff1a;web开发者、设计师、技术分享博主 &#x1f40b; 希望大家多多支持一下, 我们一起学习和进步&#xff01;&#x1f604; &#x1f3c5; 如果文章对你有帮助的话&#xff0c;欢迎评论 &#x1f4ac;点赞&a…

Oracle忘记所有密码怎么办

最近遇到一个Oracle的问题&#xff0c;密码要过期了&#xff0c;但是除了用户密码&#xff0c;其他密码都不知道了&#xff0c;修改不了密码怎么办呢&#xff1f; 试了各种方法&#xff0c;最终下面的方式生效了&#xff1a; 首先&#xff0c;使用orapwd生成新的密码文件&…

云计算如何创芯:“逆向工作法”的性感之处

在整个云计算领域&#xff0c;能让芯片规模化的用起来&#xff0c;是决定造芯是否成功的天花板。在拉斯维加斯的亚马逊云科技2023 re:Invent则是完美诠释了这一论调。 亚马逊云科技2023 re:Invent开幕前两个小时&#xff0c;有一场小型的欢迎晚宴&#xff0c;《星期日泰晤士报》…

BUUCTF [GXYCTF2019]SXMgdGhpcyBiYXNlPw== 1

BUUCTF:https://buuoj.cn/challenges 题目描述&#xff1a; 得到的 flag 请包上 flag{} 提交。 密文&#xff1a; 下载附件&#xff0c;解压得到flag.txt文件。 解题思路&#xff1a; 1、打开flag.txt文件&#xff0c;内容如下。 Q2V0dGUgbnVpdCwK SW50ZW5hYmxlIGluc29tbm…

Python编程题集(第三部容器操作 )

Demo61 指定等级 题目描述 读入学生成绩&#xff0c;获取最高分best&#xff0c;然后根据下面的规则赋等级值&#xff1a; &#xff08;1&#xff09;如果分数≥best-10&#xff0c;等级为A &#xff08;1&#xff09;如果分数≥best-20&#xff0c;等级为B &#xff08;1…

常见基础指令【Linux】

目录 一、Linux基本指令1. ls2. pwd3. cd4. touch5. mkdir6. rm和rmdir7. man8. cp9. mv10. cat11. tac12. more13. less14. head15. tail16. date17. cal18. find19. grep20. zip/unzip21. echo22. wc23. tree24. which25. alias26. whoami27. stat28. tar29. uname30. shutdo…

如何自定义winform控件,并把它添加到工具箱,供拖动使用

首先&#xff0c;在想要用自定义控件的解决方案中新建一个项目&#xff0c;该项目用来存放所有的自定义控件。 解决方案-右键-添加-新建项目 添加新项目的界面选择Windows窗体控件库&#xff0c;点击确定。 此时&#xff0c;已经添加好了新的项目&#xff0c;默认会有一个自定…

记RocketMQ本地开发环境搭建始末

前言 最近工作中涉及到了RocketMQ的应用&#xff0c;为方便开发决定本地搭建一套RocketMQ的使用环境。 果然实践是个好东西... VMware虚拟环境搭建 这个网上有很多教程&#xff0c;只会比我写的详细有条理&#xff0c;这里就不在赘述了。 虚拟机搭建好之后每次重启电脑都无…

nginx配置反向代理及负载均衡

目录 1.前端发送的请求&#xff0c;是如何请求到后端服务的1.nginx 反向代理的好处&#xff1a;2.nginx 反向代理的配置方式&#xff1a;3. nginx 负载均衡的配置方式 1.前端发送的请求&#xff0c;是如何请求到后端服务的 1.nginx 反向代理的好处&#xff1a; 提高访问速度 因…

全系降3万,一把干到底,极越「智取」特斯拉

作者|德新 编辑|王博 11月30日&#xff0c;极越01官宣全系降价3万。 这意味着21.99万起步的极越01 Max&#xff0c;成为这个市场上入门门槛最低的带有城市智能驾驶辅助功能的车型。 要知道这是一台比Model Y大了一圈&#xff0c;全系配置了高阶智驾硬件&#xff0c;全系配高…

Apache HTTPD 2.448 mod_proxy SSRF漏洞(CVE-2021-40438)

任务一&#xff1a; 复现漏洞 任务二&#xff1a; 尝试利用SSRF漏洞&#xff0c;访问重庆邮电大学官网&#xff08;http://www.cqupt.edu.cn) 1.搭建环境 2.了解这个地方是httpd作为了一个反向代理服务器&#xff0c;也就是先是客户端发送请求给代理服务器&#xff0c;然后…

Neo4j 程序开发 JavaAPI 嵌入式开发模式(头歌)

文章目录 第1关&#xff1a;JavaAPI 嵌入式开发模式任务描述相关知识创建 Neo4j 数据库启动 Neo4j 数据事务创建节点创建节点关系将创建的数据库设置为默认数据库 编程要求测试说明答案代码修改配置文件&#xff0c;更改默认 Neo4j 数据库代码文件 第1关&#xff1a;JavaAPI 嵌…

【文献阅读笔记】关于GANomaly的异常检测方法

文章目录 1、GANomaly: Semi-Supervised Anomaly Detection via Adversarial Training模型主要创新 2、Skip-GANomaly: Skip Connected and AdversariallyTrained Encoder-Decoder Anomaly Detection模型主要创新点 3、Industrial surface defect detection and localization u…