vue 使用腾讯地图

项目要求web端用若依框架引用腾讯地图 ,搜了些配合官网完成后,记录中间的曲折,

一、引用vue  web端引用腾讯地图

注册腾讯地图appkey 

WebService API | 腾讯位置服务

注意点

这是一个Vue集成腾讯地图的demo  

项目中需要在index.html上事先引入以下内容

<script src="https://map.qq.com/api/gljs?v=1.exp&key=你注册之后获取的key值"></script><script src="https://mapapi.qq.com/web/mapComponents/geoLocation/v/geolocation.min.js"></script><script charset="utf-8" src="https://map.qq.com/api/gljs?libraries=tools&v=1.exp&key=你注册之后获取的key值"></script>

 然后在main.js 文件下写入这几行代码

Vue.prototype.$Map = window.TMap
Vue.prototype.$Location = new window.qq.maps.Geolocation('你自己的key', '腾讯地图模板-博客展示')OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77 这个是腾讯官方例子的appkey  

书到此地,大部分道友应该直接复制粘贴就可以完美的跑起腾讯地图了。

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

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

相关文章

牧神记开分9.7,2024新国漫巅峰出现了

现在国漫越来越卷了&#xff0c;卷播放量也卷评分。最近&#xff0c;b站上线不久的国漫《牧神记》开分9.7&#xff0c;口碑还是相当不错的&#xff0c;已经和《凡人修仙传》评分齐平。这部国漫仅仅播出4集&#xff0c;为什么就能获得这么高的评分呢&#xff1f;下面就一起来看看…

了解GPT大模型,读这本书就够了!(文末送书)

小异最近发现&#xff0c;当国外OpenAI的权力的游戏反转再反转的时候&#xff0c;国内的AI创业者们除了吃瓜之外也没闲着。 有很多程序员正在AIGC赛道中默默发财&#xff0c;有通过短视频做内容爆火&#xff0c;接广告的&#xff1b;有卖AI解决方案的&#xff1b;有卖AI课程的…

〔 MySQL 〕数据库基础

1. 数据库基础&#xff08;重点&#xff09; 1.1 什么是数据库 存储数据用文件就可以了&#xff0c;为什么还要弄个数据库?文件保存数据有以下几个缺点&#xff1a; ● 文件的安全性问题 ● 文件不利于数据查询和管理 ● 文件不利于存储海量数据 …

【软件工程】耦合

耦合性指软件结构中模块相互紧密连接的紧密程度。 耦合性由高到低分别为&#xff1a;内容耦合、公共耦合、外部耦合、控制耦合、标记耦合、数据耦合、非直接耦合。 1.内容耦合&#xff1a; 一个模块直接使用或修改另一个模块的内部数据或逻辑。 例如&#xff1a;一个函数直…

关于C++友元函数的优缺点和应用场景!

成长路上不孤单&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a;&#x1f60a; 【14后&#x1f60a;///C爱好者&#x1f60a;///持续分享所学&#x1f60a;///如有需要欢迎收藏转发///&#x1f60a;】 今日分享关于C 友元函数的相关内容&#xff01; 关于…

笔记本怎么开启TPM2.0_笔记本开启TPM2.0教程(不同笔记本开启tpm2.0方法)

在win11最低要求是提示&#xff0c;电脑必须满足 TPM 2.0&#xff0c;并开需要开启TPM 才能正常安装windows11系统&#xff0c;有很多笔记本的用户问我&#xff0c;笔记本怎么开启tpm功能呢&#xff1f;下面小编就给大家详细介绍一下笔记本开启tpm功能的方法。 如何确认你笔记本…

HTML5+css3(浮动,浮动的相关属性,float,解决浮动的塌陷问题,clear,overflow,给父亲盒子加高度,伪元素)

浮动的相关属性 以下使浮动的常用属性值&#xff1a; float&#xff1a; 设置浮动 以下属性&#xff1a; left : 设置左浮动 right : 设置右浮动 none &#xff1a;不浮动&#xff0c;默认值clear 清除浮动 清除前面兄弟元素浮动元素的响应 以下属性&#xff1a; left &…

Fastjson反序列化漏洞部署复现1.2.24版本反序列RCE笔记

环境部署 docker容器地址&#xff1a;https://github.com/vulhub/vulhub/tree/master/fastjson/1.2.24-rce 启动docker环境 docker容器每次一启动就报错 根据docker log [容器id] 查看报错日志发现有如下报错 library initialization failed - unable to allocate file desc…

PostgreSQL pg-xact(clog)目录文件缺失处理

一、 背景 前些天晚上突然收到业务反馈&#xff0c;查询DB中的一个表报错 Could not open file "pg-xact/005E": No such file or directory. 两眼一黑难道是文件损坏了...登录查看DB日志&#xff0c;还好没有其他报错&#xff0c;业务也反馈只有这一个表在从库查询报…

【Python】项目结构

【Python】项目结构 前言前置知识Python 的基本项目结构int main() 与 def main() 的区别举例&#xff1a;基于 KNN 的 OpenCV 数字识别的项目结构 前言 本文总结了 Python 项目结构的知识&#xff0c;规范项目结构能使得项目开发过程高效流畅&#xff0c;提升代码可读性、团队…

arcgis pro 学习笔记

二维三维集合在一起&#xff0c;与arcgis不同 一、首次使用&#xff0c;几个基本设置 1.选项——常规里面设置自动保存时间 2.新建工程文件&#xff0c;会自动加载地图&#xff0c;可以在选项里面设置为无&#xff0c;以提高启动效率。 3.设置缓存位置&#xff0c;可勾选每次…

OpenCV视觉分析之目标跟踪(11)计算两个图像之间的最佳变换矩阵函数findTransformECC的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 根据 ECC 标准 78找到两幅图像之间的几何变换&#xff08;warp&#xff09;。 该函数根据 ECC 标准 ([78]) 估计最优变换&#xff08;warpMatri…

.vue文件中定义变量和在引用的.ts文件中定义变量的区别

在 Vue 3 项目中&#xff0c;你可以在 .vue 文件和单独的 .ts 文件中定义变量。这两种方式有一些关键的区别&#xff1a; 在 .vue 文件中定义变量 局部作用域&#xff1a; 在 .vue 文件的 <script setup> 或 <script> 标签中定义的变量&#xff0c;它们的作用域仅限…

开源项目工具:LeanTween - 为Unity 3D打造的高效缓动引擎详解(比较麻烦的API版)之二———补间动画控制API系列

1.文档中的cancel,resume,pause LeanTween.cancel ( gameObject:GameObject id:int )LeanTween.cancel ( ltRect:LTRect id:int )LeanTween.cancel ( gameObject:GameObject )LeanTween.pause ( gameObject:GameObject )LeanTween.resume ( id:int )LeanTween.resume ( game…

Redis 典型应用 - 缓存(cache)

一、什么是缓存 缓存(cache)是计算机中的⼀个经典的概念.在很多场景中都会涉及到. 核⼼思路就是把⼀些常⽤的数据放到触⼿可及(访问速度更快)的地⽅,⽅便随时读取. 这⾥所说的"触⼿可及"是个相对的概念. 对于硬件的访问速度来说,通常情况下: CPU寄存器>内存>…

第十六章 TCP 客户端 服务器通信

文章目录 第十六章 TCP 客户端/服务器通信TCP 客户端/服务器通信TCP 连接概述TCP 设备的 OPEN 命令 第十六章 TCP 客户端/服务器通信 TCP 客户端/服务器通信 本章介绍如何使用 TCP/IP 在 IRIS 数据平台进程之间设置远程通信。 IRIS 支持两种互联网协议 (IP)&#xff1a;TCP …

【数学二】线性代数-矩阵-初等变换、初等矩阵

考试要求 1、理解矩阵的概念,了解单位矩阵、数量矩阵、对角矩阵、三角矩阵、对称矩阵、反对称矩阵和正交矩阵以及它们的性质. 2、掌握矩阵的线性运算、乘法、转置以及它们的运算规律,了解方阵的幂与方阵乘积的行列式的性质. 3、理解逆矩阵的概念,掌握逆矩阵的性质以及矩阵可…

DevCheck Pro手机硬件检测工具v5.33

前言 DevCheck Pro是一款手机硬件和操作系统信息检测查看工具&#xff0c;该软件的功能非常强大&#xff0c;为用户提供了系统、硬件、应用程序、相机、网络、电池等一系列信息查看功能 安装环境 [名称]&#xff1a;DevCheckPro [版本]&#xff1a;5.33 [大小]&a…

教程:FFmpeg结合GPU实现720p至4K视频转换

将一个 720p 的视频放大编码到 4K&#xff0c;这样的视频处理在很多业务场景中都会用到。很多视频社交、短视频、视频点播等应用&#xff0c;都会需要通过服务器来处理大量的视频编辑需求。 本文我们会探讨一下做这样的视频处理&#xff0c;最低的 GPU 指标应该是多少。利用开源…

鸿蒙进阶篇-网格布局 Grid/GridItem(二)

hello大家好&#xff0c;这里是鸿蒙开天组&#xff0c;今天让我们来继续学习鸿蒙进阶篇-网格布局 Grid/GridItem&#xff0c;上一篇博文我们已经学习了固定行列、合并行列和设置滚动&#xff0c;这一篇我们将继续学习Grid的用法&#xff0c;实现翻页滚动、自定义滚动条样式&…