当前位置: 首页 > news >正文

uniapp接入BMapGL百度地图

下面代码兼容安卓APP和H5

百度地图官网:控制台 | 百度地图开放平台 应用类别选择《浏览器端》

/utils/map.js 需要设置你自己的key

export function myBMapGL1() {return new Promise(function(resolve, reject) {if (typeof window.initMyBMapGL1 === 'function') {resolve(window.initMyBMapGL1)return}window.initMyBMapGL1 = function() {resolve(window.initMyBMapGL1)}var script = document.createElement('script')script.type = 'text/javascript'script.src = `https://api.map.baidu.com/api?v=1.0&type=webgl&ak=你的key&callback=initMyBMapGL1`script.onerror = rejectdocument.head.appendChild(script)})
}

页面代码

<template><view class="baiduMap"><view class="map" v-bind:style="{ height: windowHeight * 2 + 'rpx'}" id="container"></view></view>
</template><script>export default {data() {return {windowHeight: "",}},methods: {},mounted() {uni.getSystemInfo({success: res => {this.windowHeight = res.windowHeight;}});}}
</script><script module="allmap" lang="renderjs">import {myBMapGL1} from "@/utils/map.js";let bmap;export default {data() {return {}},methods: {//获取地图信息initMap() {myBMapGL1().then((res) => {// 创建地图实例bmap = new BMapGL.Map("container");//  设置个性化地图// bmap.setMapStyleV2({// 	styleId: '',// });// 地图初始化,设置中心点坐标和地图缩放比例bmap.centerAndZoom(new BMapGL.Point(113.88308, 22.55329), 5);// 开启鼠标滚轮缩放bmap.enableScrollWheelZoom(true);// 地图缩放事件bmap.addEventListener('zoomend', (e) => {console.log("zoomend--", e);});// 地图拖拽事件bmap.addEventListener('dragend', (e) => {console.log("dragend--", e);});})},},mounted() {this.initMap()},beforeDestroy() {// 离开页面销毁地图bmap && bmap.destroy();bmap = null}}
</script><style lang="scss" scoped>
</style>

效果图

相关文章:

uniapp接入BMapGL百度地图

下面代码兼容安卓APP和H5 百度地图官网&#xff1a;控制台 | 百度地图开放平台 应用类别选择《浏览器端》 /utils/map.js 需要设置你自己的key export function myBMapGL1() {return new Promise(function(resolve, reject) {if (typeof window.initMyBMapGL1 function) {r…...

AWTK 最新动态:支持鸿蒙系统(HarmonyOS Next)

HarmonyOS是全球第三大移动操作系统&#xff0c;有巨大的市场潜力&#xff0c;在国产替代的背景下&#xff0c;机会多多&#xff0c;AWTK支持HarmonyOS&#xff0c;让AWTK开发者也能享受HarmonyOS生态的红利。 AWTK全称为Toolkit AnyWhere&#xff0c;是ZLG倾心打造的一套基于C…...

React基础知识一

写的东西太多了&#xff0c;照成csdn文档编辑器都开始卡顿了&#xff0c;所以分篇写。 1.安装React 需要安装下面三个包。 react:react核心包 react-dom:渲染需要用到的核心包 babel:将jsx语法转换成React代码的工具。&#xff08;没使用jsx可以不装&#xff09;1.1 在html中…...

Oracle热备过程中对数据库崩溃的处理方法

引言 在热备过程中如果发生数据库崩溃、断电等情况该如何处理? 如果正在备份 users 表空间的数据文件过程中,此时的数据文件表头 SCN 会被锁定,此时正在复制数据文件时数据库崩溃,系统断电。 从而导致数据文件表头与控制文件中的不一致,导致数据库无法打开,会要求介质恢…...

身份证实名认证API接口助力电商购物安全

亲爱的网购达人们&#xff0c;你们是否曾经因为网络上的虚假信息和诈骗而感到困扰&#xff1f;在享受便捷的网购乐趣时&#xff0c;如何确保交易安全成为了我们共同关注的话题。今天&#xff0c;一起来了解一下翔云身份证实名认证接口如何为电子商务保驾护航&#xff0c;让您的…...

win10 禁止更新

一、winR 输入 regedit 二、输入注册列表路径&#xff1a; &#xff08;1&#xff09;计算机\HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\WindowsUpdate\UX\Settings &#xff08;2&#xff09;按照格式&#xff0c;创建文件命名: FlightSettingsMaxPauseDays &#xff08;3&…...

运维百科:网络性能20大关键指标

网络性能评估是确保网络服务质量和用户体验的关键环节。在网络、运维领域中&#xff0c;存在着一系列关键的性能指标&#xff0c;共同构成了衡量网络性能的基础。以下是网络性能的20大关键指标&#xff0c;每个指标都承载着特定的意义和重要性。 1.速率&#xff08;Rate&#…...

java编程开发基础,正则表达式的使用案例Demo

java编程开发基础,正则表达式的使用案例Demo!实际开发中&#xff0c;经常遇到一些字符串&#xff0c;信息的裁剪和提取操作&#xff0c;正则表达式是经常使用的&#xff0c;下面的案例&#xff0c;可以帮助大家快速的了解和熟悉&#xff0c;正则表达式的使用技巧。 package com…...

结构控制

目录​​​​​​​ 1.顺序结构 2.分支结构 2.1.单分支结构 2.2.二分支结构 2.3.多分支结构 2.4.嵌套分支结构 3.循环结构 3.1.while 循环结构 3.2.while...else 循环结构 PS&#xff1a;break 关键字 PS&#xff1a;pass 关键字 3.3.for 循环结构 PS&#xff1a;…...

Go语言中的内存分配与初始化:new与make函数详解

在Go语言中&#xff0c;内存分配和初始化是编程的基础操作。Go提供了两个内置函数new和make&#xff0c;用于不同场景下的内存分配和初始化。理解这两个函数的区别和适用场景对于编写高效、安全的Go代码至关重要。本文将详细介绍new和make函数&#xff0c;并提供示例说明它们的…...

The 2024 ICPC Kunming Invitational Contest

VP链接&#xff1a;https://codeforces.com/gym/105386 B. Gold Medal 签到题。对每一个读入的数 a&#xff0c;先记录已有奖牌数量&#xff0c;即 &#xff0c;再将 a 对 k 取模。然后将 a 数组从大到小排序&#xff0c;将每个不足 k 的数补到 k。如果 m 有剩余&#xff0c;…...

对原jar包解压后修改原class文件后重新打包为jar

文章目录 背景三种修改方式1.POM中移除原jar中依赖的历史版本2.原jar它不使用pom依赖而是直接放在源码中再编译使用JarEditor 插件对源码进行修改(推荐)使用java-decompiler反编译后修改源码覆盖原class&#xff08;不好用-不推荐直接跳过&#xff09;提醒 参考资料-推荐阅读拓…...

【C++】ReadFile概述,及实践使用时ReadFile的速率影响研究

ReadFile 函数概述 ReadFile 是 Windows API 函数&#xff0c;用于从文件或设备&#xff08;如串口、硬盘等&#xff09;中读取数据。它是同步和异步 I/O 操作的基础函数。 函数原型 BOOL ReadFile(_In_ HANDLE hFile, // 文件或设备句柄_Out_write…...

WebGL进阶(十一)层次模型

理论基础&#xff1a; 效果&#xff1a; 源码&#xff1a; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"IEedge"><meta name"vie…...

Django:从入门到精通

一、Django背景 Django是一个由Python编写的高级Web应用框架&#xff0c;以其简洁性、安全性和高效性而闻名。Django最初由Adrian Holovaty和Simon Willison于2003年开发&#xff0c;旨在简化Web应用的开发过程。作为一个开放源代码项目&#xff0c;Django迅速吸引了大量的开发…...

C++设计模式行为模式———中介者模式

文章目录 一、引言二、中介者模式三、总结 一、引言 中介者模式是一种行为设计模式&#xff0c; 能让你减少对象之间混乱无序的依赖关系。 该模式会限制对象之间的直接交互&#xff0c; 迫使它们通过一个中介者对象进行合作。 中介者模式可以减少对象之间混乱无序的依赖关系&…...

Perfetto学习大全

Perfetto 是一个功能强大的性能分析和追踪工具&#xff0c;主要用于捕获和分析复杂系统中的事件和性能数据&#xff0c;特别是在 Android 和 Linux 环境下。它的核心目标是帮助开发者深入了解系统和应用程序的运行状态&#xff0c;以便优化性能和诊断问题。 Perfetto的主要作用…...

管家婆财贸ERP BR040.销售单明细表变更

最低适用版本&#xff1a; C系列 23.8 插件简要功能说明&#xff1a; 销售明细表支持直接修改单据自由项1-16更多细节描述见下方详细文档 插件操作视频&#xff1a; 进销存类定制插件--销售单明细表变更 1. 应用中心增加菜单【销售单明细表变更】 a. 复制23.8版本销售单明细…...

2411rust,实现特征

原文 在Rust2024中,impl Trait在中位置的默认工作方式有了变化.是为了简化impl Trait,以更好地匹配人们一般的需求. 还添加了一个灵活的语法,让你需要时可完全控制. 从Rust2024开始,一直在更改,何时可在返回位置impl Trait的隐藏类型中使用泛型参数的规则: 1,即对返回位置i…...

SpringBoot3与JUnit5集成测试

你可以在 Spring Boot 3 中轻松设置和运行 JUnit 集成测试。合理使用 Spring 提供的注解和工具&#xff0c;可以确保测试的高效性和可靠性。以下是集成测试的步骤和示例&#xff1a; 1. 添加依赖 在 pom.xml 中添加 Spring Boot Starter Test 依赖&#xff0c;它包含 JUnit 5 …...

工程企业需要什么样的物资管理系统?为什么需要物资管理系统?

一、背景与意义 在工程项目的建设中&#xff0c;无论是高楼大厦的拔地而起&#xff0c;还是高速公路的绵延铺展&#xff0c;物资都是最基础的要素之一。从钢筋水泥到施工机械&#xff0c;任何一种物资的管理不善都可能导致项目延误、成本超支&#xff0c;甚至质量问题。然而&a…...

Vue + Websocket播放PCM(base64转ArrayBuffer、 字符串转ArrayBuffer)

文章目录 引言I 音视频处理相关概念和APIII 案例:基于开源库 pcm-player方式播放借助MediaSource和Audio对象播放音频流。基于原生api AudioContext 播放操作III 格式转换js字符串转ArrayBufferbase64 转 ArrayBufferIV 解决pcm-player分片播放问题引言 需求: 基于webscoket传…...

华为防火墙技术基本概念学习笔记

1.防火墙概述 1.1防火墙与交换机、路由器对比 路由器与交换机的本质是转发&#xff0c;防火墙的本质是控制。 防火墙与路由器、交换机是有区别的。路由器用来连接不同的网络&#xff0c;通过路由协议保证互联互通&#xff0c;确保将报文转发到目的地;交换机则通常用来组建局域…...

Mesh路由组网

Mesh无线网格网络&#xff0c;多跳&#xff08;multi-hop&#xff09;网络&#xff0c;为解决全屋覆盖信号&#xff0c;一般用于家庭网络和小型企业 原理 网关路由器&#xff08;主路由&#xff0c;连接光猫&#xff09;&#xff0c;Mesh路由器&#xff08;子路由&#xff0c;…...

【数据结构】七种常用排序总结

一、七种排序及其讲解 以下为七种排序的讲解&#xff1a; 【数据结构】插入排序——直接插入排序 和 希尔排序 【数据结构】选择排序——选择排序 和 堆排序 【数据结构】交换排序——冒泡排序 和 快速排序 【数据结构】归并排序 —— 递归及非递归解决归并排序 二、排序的…...

【在Linux世界中追寻伟大的One Piece】多线程(一)

目录 1 -> Linux线程概念 1.1 -> 什么是线程 1.2 -> 线程的优点 1.3 -> 线程的缺点 1.4 -> 线程异常 1.5 -> 线程用途 2 -> Linux线程 VS 进程 2.1 -> 线程和进程 2.2 -> 进程的多个线程共享 3 -> Linux线程控制 3.1 -> POSIX线程…...

《Python编程实训快速上手》第十天--处理CSV文件和JSON数据

CSV&#xff1a;简化的电子表格&#xff0c;被保存为纯文本文件 JSON&#xff1a;是一种数据交换格式&#xff0c;易于人阅读和编写&#xff0c;同时也易于机器解析和生成&#xff0c;以JavaScript源代码的形式将信息保存在纯文本文件中 一、csv模块 CSV文件中的每行代表电…...

基于springboot停车场管理系统源码和论文

如今社会上各行各业&#xff0c;都喜欢用自己行业的专属软件工作&#xff0c;互联网发展到这个时候&#xff0c;人们已经发现离不开了互联网。新技术的产生&#xff0c;往往能解决一些老技术的弊端问题。因为传统停车场管理系统信息管理难度大&#xff0c;容错率低&#xff0c;…...

Linux的桌面

Linux的桌面是可以卸载的 的确&#xff0c;Linux并不像Windows&#xff0c;Linux本身是一个基于命令行的操作系统&#xff0c;在内核眼中&#xff0c;桌面只不过是个普通的应用程序&#xff0c;所以&#xff0c;在Linux的桌面中可以完成的事情&#xff0c;命令行中也基本可以完…...

Spring Boot 3.0废弃了JavaEE,改用了Jakarta EE

Spring Boot 3.0废弃了JavaEE&#xff0c;改用了Jakarta EE 历史背景 javax变成Jakarta的主要原因是因为Java EE项目从Oracle转移到了Eclipse Foundation&#xff0c;并改名为Jakarta EE。 JavaEE是从Java 1.2版本开始推出的Java企业级开发平台&#xff0c;最初的名称是J2EE(J…...

java-排序算法汇总

排序算法&#xff1a; 冒泡排序&#xff08;Bubble Sort&#xff09; 选择排序&#xff08;Selection Sort&#xff09; 插入排序&#xff08;Insertion Sort&#xff09; 快速排序&#xff08;Quick Sort&#xff09; 归并排序&#xff08;Merge Sort&#xff09; 堆排序&…...

C0030.Clion中运行提示Process finished with exit code -1073741515 (0xC0000135)解决办法

1.错误提示 2.解决办法 添加环境变量完成之后&#xff0c;重启Clion软件&#xff0c;然后就可以正常调用由mingw编译的opencv库了。...

如何理解JS的 异步

JS是一门单线程的语言&#xff0c;这是因为它运行在浏览器的渲染主线程中&#xff0c;而渲染主线程只有一个。 而渲染主线程承担着诸多的工作&#xff0c;渲染页面、执行JS都在其中运行。 如果使用同步的方式&#xff0c;就极有可能导致主线程产生阻塞&#xff0c;从而导致消…...

vsgithub

VS&GitHub项目联动&#xff08;上传和克隆&#xff09;&#xff0c;创建你的第一个仓库&#xff0c;小白配置_vs上传代码到github-CSDN博客...

Android蓝牙架构,源文件目录/编译方式学习

Android 版本 发布时间 代号&#xff08;Codename&#xff09; Android 1.0 2008年9月23日 无 Android 1.1 2009年2月9日 Petit Four Android 1.5 2009年4月27日 Cupcake Android 1.6 2009年9月15日 Donut Android 2.0 2009年10月26日 Eclair Android 2.1 2…...

10 - Clickhouse集群部署以及副本和分片

目 一、副本 1、简介 2、副本写入流程 3、副本配置步骤 3.1、启动zookeeper集群 3.2、在 hallo100 的/etc/clickhouse-server/config.d 目录下创建一个名为metrika.xml 的配置文件,内容如下&#xff1a; 3.3、在 hallo100 的/etc/clickhouse-server/config.xml 中增加如…...

FreeRTOS的软件定时器与事件标志组

目录 1.FreeRTOS软件定时器 1.1 什么是FreeRTOS软件定时器&#xff1f; 1.2 学习软件定时器的意义 1.3 软件定时器的简介 1.3.1 软件定时器概述 1.3.2 编写回调函数的注意事项 1.4 定时器服务/Daemon 任务 1.4.1 定时器服务任务与队列 1.4.2 定时器相关配置 configUSE_T…...

生产制造领域的多元化模式探索

在当今全球化和信息化的时代背景下&#xff0c;生产制造领域正经历着前所未有的变革。随着消费者需求的多样化、市场竞争的加剧以及技术的不断进步&#xff0c;传统的生产制造模式已经难以满足现代企业的需求。因此&#xff0c;多种生产制造模式应运而生&#xff0c;以适应不同…...

大数据技术之SparkCore

RDD概述 什么是RDD RDD&#xff08;Resilient Distributed Dataset&#xff09;叫做弹性分布式数据集&#xff0c;是Spark中最基本的数据抽象。代码中是一个抽象类&#xff0c;它代表一个弹性的、不可变、可分区、里面的元素可并行计算的集合。 RDD五大特性 RDD编程 RDD的创…...

element-plus的组件数据配置化封装 - table

目录 一、封装的table、table-column组件以及相关ts类型的定义 1、ATable组件的封装 - index.ts 2、ATableColumn组件的封装 - ATableColumn.ts 3、ATable、ATableColumn类型 - interface.ts 二、ATable、ATableColumn组件的使用 三、相关属性、方法的使用以及相关说明 1. C…...

蓝桥杯每日真题 - 第15天

题目&#xff1a;&#xff08;钟表&#xff09; 题目描述&#xff08;13届 C&C B组B题&#xff09; 解题思路&#xff1a; 理解钟表指针的运动&#xff1a; 秒针每分钟转一圈&#xff0c;即每秒转6度。 分针每小时转一圈&#xff0c;即每分钟转6度。 时针每12小时转一圈…...

c#:winform调用bartender实现打印(学习整理笔记)

效果 学习路径 C# winform调用Bartender进行自定义打印、批量打印、检索文件夹中的模板_哔哩哔哩_bilibili 一、初始环境搭建见&#xff1a; c#:winform引入bartender-CSDN博客https://blog.csdn.net/weixin_46001736/article/details/143989473?sharetypeblogdetail&s…...

周期法频率计的设计

目录 周期法频率计 分析&#xff1a; 设计过程&#xff1a; 周期法频率计 对于低频信号&#xff0c;应用周期法进行测频。周期法测频的基本原理是&#xff1a;应用标准频率信号统计被测信号两个相邻脉冲之间的脉冲数&#xff0c;然后通过脉冲数计算出被测信号的周期&#xff…...

【2024亚太杯亚太赛APMCM C题】数学建模竞赛|宠物行业及相关产业的发展分析与策略|建模过程+完整代码论文全解全析

第一个问题是&#xff1a;请基于附件 1 中的数据以及你的团队收集的额外数据&#xff0c;分析过去五年中国宠物行业按宠物类型的发展情况。并分析中国宠物行业发展的因素&#xff0c;预测未来三年中国宠物行业的发展。 第一个问题&#xff1a;分析中国宠物行业按宠物类型的发展…...

uniapp的renderjs使用

‌uniapp中的RenderJS主要服务于APP和H5平台&#xff0c;其作用包括降低逻辑层和视图层的通讯损耗&#xff0c;提供高性能视图交互能力&#xff0c;以及在视图层操作DOM和运行Web的JS库‌。 RenderJS是uni-app中一个特性&#xff0c;它允许开发者在页面中使用JavaScript直接渲…...

CPU命名那些事

一、Intel CPU命名 1. 命名结构 Intel CPU 的命名通常包含以下几个部分&#xff1a; 品牌 产品线 系列 代数 具体型号 后缀 例如&#xff1a;Intel Core i7-13700K 2. 各部分含义 品牌 Intel&#xff1a;表示厂商&#xff08;几乎所有命名中都有&#xff09;。不同品…...

【LLM】一文学会SPPO

博客昵称&#xff1a;沈小农学编程 作者简介&#xff1a;一名在读硕士&#xff0c;定期更新相关算法面试题&#xff0c;欢迎关注小弟&#xff01; PS&#xff1a;哈喽&#xff01;各位CSDN的uu们&#xff0c;我是你的小弟沈小农&#xff0c;希望我的文章能帮助到你。欢迎大家在…...

鸿蒙多线程开发——线程间数据通信对象03(sendable)

1、简 介 在传统JS引擎上&#xff0c;对象的并发通信开销的优化方式只有一种&#xff0c;就是把实现下沉到Native侧&#xff0c;通过Transferable对象的转移或共享方式降低并发通信开销。而开发者仍然还有大量对象并发通信的诉求&#xff0c;这个问题在业界的JS引擎实现上并没…...

web前端开发--动画效果

1、3D旋转 <!DOCTYPE html> <html><head><meta charset"UTF-8"><title>3D旋转</title><style type"text/css">div{/*设置大盒子样式*/width: 100px;height: 100px;/*background-color: rgba(255,0,0,0.5);*/ba…...

【数据分享】中国价格统计年鉴(2013-2024) PDF

数据介绍 犹如一座珍贵的宝库&#xff0c;全面而系统地记录了中国在这一时期的价格变动情况。它涵盖了丰富的内容&#xff0c;包括宏观经济指标、商品价格、居民消费价格以及城市物价监测等多个方面。 在宏观经济指标方面&#xff0c;年鉴中收录了 GDP、CPI、PPI 等重要数据&…...