Uniapp当中使用腾讯位置路线规划插件保姆教学

这篇具有很好参考价值的文章主要介绍了Uniapp当中使用腾讯位置路线规划插件保姆教学。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

首先我们在使用腾讯地图插件之前我们需要先做几点准备

1:我们需要在腾讯地图位置服务当中注册账号以及在控制台当中创建应用和创建key
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app

这里在创建应用当中应用类型一定要选出行类型,否则后期可能会出现问题。

Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
我们创建完应用之后,点击创建key进行编写
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
这里我们在添加key的过程当中,我们需要用到我们的APPID,这个就是我们的微信小程序当中的设置,里面去找我们的APPID。
小程序链接: https://mp.weixin.qq.com/wxamp/basicprofile/index?token=798022700&lang=zh_CN
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
然后复制这个APPID粘贴到我们的创建表当中
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
3:然后我们需要下载JavascriptSDK
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
这个时候,会报错,我们就需要在onload和onshow当中我们的qqmapsdk前面加上this指向,这里我们还需要将我们的key值获取到添加到我们的key当中

这里我们还要注意,我们需要将我们的域名进行合法化

Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app

4:我们在小程序当中添加插件
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
布置完上面的一些信息在我们的小程序页面的第三方设置当中就会是下面的情况,然后我们点击详情进入到我们的官方文档当中
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
然后我们按照文档当中教程先去配置允许小程序进行定位服务。这里他是微信小程序端开发的,那么我们在Hbuilder当中打开manifest.json文件,在源码视图当中的mp-weixin当中设置。
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
然后我们按照官方文档当中教程进行使用
Uniapp当中使用腾讯位置路线规划插件保姆教学,uniapp,uni-app
好,这样我们就实现了这个腾讯地图路线规划的插件,如果说还有疑问的话可以私信和评论文章来源地址https://www.toymoban.com/news/detail-649311.html

到了这里,关于Uniapp当中使用腾讯位置路线规划插件保姆教学的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue - vue使用腾讯api进行定位获取,绘制地图、标点、搜索、路线规划

    首本文主要记录一下在Vue项目里面使用腾讯地图api实现的一些功能。如:引入腾讯地图SDK、定位获取当前经纬度和详细地址、地图marker的使用、搜索功能和路线规划。 我这边实现的效果图如下: 首先要成为腾讯位置服务开发者或者使用公司提供的 key 值;才可以使用腾

    2023年04月17日
    浏览(51)
  • 【uniapp】 微信小程序使用腾讯API地图、路线轨迹、marker标记点

    引入js import amap from \\\'@/common/qqmap-wx-jssdk.js\\\'; var qqmapsdk; qqmapsdk = new amap({ key: \\\'腾讯地图API key\\\' // 必填 }); 小程序配置合法域名 :https://apis.map.qq.com 下载地址 :请前往【小程序地图、腾讯API、商业圈、路线轨迹、地图选点】 示例图 请前往小程序查询

    2024年02月16日
    浏览(66)
  • Uniapp使用腾讯地图并进行标点创建和设置保姆教程

    我们在HBuilder左上角点击文件新建创建一个项目 然后下面这张图的话就是uniapp创建项目过程当中需要注意的一些点和具体的操作 然后我们创建完项目之后进入到项目pages文件夹下,创建一个新的Vue页面或者是也可以直接使用里面的Vue页面,然后我们需要打开Uniapp官网链接: h

    2024年02月13日
    浏览(33)
  • uniapp:记录使用uniapp对接腾讯音视频插件(TUICallKit )

    官方地址:TUICallKit—API uniapp插件地址:腾讯云音视频通话插件TencentCloud-TUICallKit 1、到鷈插件地址,购买插件,并绑定到自己的项目中。 第3步的报名,一定要与最后打包包名一致。输入包名后:下一步-------确定。 2、开通服务 1.登录到 即时通信 IM 控制台,单击创建新应用,

    2024年02月10日
    浏览(47)
  • uniapp微信小程序使用腾讯地图选点插件

    在A页面获取当前经纬度之后跳转至B页面打开腾讯地图选点插件 注意需要把微信开发者工具中的本地设置中的版本改为2.17.0,不然会报错 2.1使用腾讯地图 lbs.qq.com,控制台-应用管理-我的应用中,创建应用,并在相应的应用中创建Key。 注意勾选WebServiceAPI和微信小程序 web配置

    2024年02月09日
    浏览(59)
  • uniapp实现路线规划

    UniApp是一个基于Vue.js框架开发的跨平台应用开发框架,可以同时构建iOS、Android、H5等多个平台的应用。它使用了基于前端技术栈的Web开发方式,通过编写一套代码,即可在不同平台上运行和发布应用。 UniApp具有以下特点: 跨平台开发:UniApp支持将一套代码同时转换为iOS、A

    2024年02月06日
    浏览(71)
  • uniapp - 微信小程序接入腾讯视频播放器功能插件,uniapp开发微信小程序端调用引入并使用腾讯视频播放组件完整全流程(详细示例源码,一键复制开箱即用)

    在uniapp 微信小程序项目中,集成腾讯视频功能插件,实现播放腾讯视频效果,附带详细示例源码及注释, 你可以跟着步骤一步步来,保证几分钟就能快速在uniapp小程序项目中植入腾讯视频功能!

    2024年02月12日
    浏览(58)
  • 微信小程序 ‘腾讯位置服务地图选点插件申请失败’

    1.登录微信公众平台 2.登录后设置-第三方设置-插件管理-添加插件  3.微信小程序插件 | 腾讯位置服务   将官网上的 配置值复制到app.json中,切记是官网上的值不是自己生成的值!!!!然后再进行编译即可。

    2024年02月11日
    浏览(49)
  • uniapp 开发安卓App实现高德地图路线规划导航

    描述这个技术是做什么的/什么情况下会使用到这个技术,学习该技术的原因,技术的难点在哪里。控制在50-100字内。 uniapp的map组件中导航路线的展示。是uniapp开发app时引入地图导航的实现方式。技术难点在于实现map组件时对于属性以及函数的细节使用很容易出现一些奇怪的

    2024年02月01日
    浏览(48)
  • uniapp&&微信小程序中打开腾讯地图获取用户位置信息

    个人项目地址: SubTopH前端开发个人站 (自己开发的前端功能和UI组件,一些有趣的小功能,感兴趣的伙伴可以访问,欢迎提出更好的想法,私信沟通,网站属于静态页面) SubTopH前端开发个人站 https://subtop.gitee.io/subtoph.github.io/#/home 实现的效果 第一步:首先登录微信公众平

    2024年02月13日
    浏览(70)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包