小程序开发API之地图wx.createMapContext及MapContext 实例

最新推荐文章于 2024-08-09 11:16:29 发布
最新推荐文章于 2024-08-09 11:16:29 发布
阅读量1.6w 收藏 30
点赞数 11
分类专栏： ONE PIECE--小程序 文章标签： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jackjia2015/article/details/86700861
版权
本文介绍了小程序中地图API的使用，重点讲解了wx.createMapContext函数及其返回的MapContext对象的方法，如getCenterLocation、moveToLocation、translateMarker、includePoints、getRegion和getScale等，这些方法可用于地图交互和视图控制。
摘要由CSDN通过智能技术生成

效果展示


在这里插入图片描述

wx.createMapContext(string mapId, Object this)

创建 map 上下文 MapContext 对象。
参数 string mapId
组件的 id
Object this
在自定义组件下，当前组件实例的this，以操作组件内 组件
返回值
MapContext

MapContext

MapContext 实例，可通过 wx.createMapContext 获取。
mapContext 通过 id 跟一个 组件绑定，操作对应的 组件。

方法

MapContext.getCenterLocation()

获取当前地图中心的经纬度。返回的是 gcj02 坐标系，可以用于 wx.openLocation()
getCenterLocation参数

最低0.47元/天 解锁文章
M.Siebel
关注
专栏目录
微信小程序 MapContext.includePoints实现自动缩放地图大小
qq_43679736的博客
11-17 1916
官方文档又是一笔带过，没办法，查资料查的一肚子火，好在最后还是实现了，直接贴代码记录一下我踩的坑，也让后面的兄弟别踩了。最近做了个功能，根据用户和商家之间的距离画出导航线，然后根据距离自动缩放地图的scale。
微信小程序map作为子组件wx.createMapContext失效
solocao的专栏
01-05 2335
我是将map封装成了子组件进行使用，发现wx.createMapContext无论如何都没有效果。最后，定睛一看，原来将map放到子组件中，再使用wx.createMapContext需要增加额外的参数this 具体使用方法如下： const mapCtx = wx.createMapContext('map', this); mapCtx.includePoints({ paddin...
uniapp中map组件点击标记点时moveToLocation方法失效
最新发布
lifeiyang313的博客
08-09 404
解决方法：点击标记点之后给一个延迟再触发moveToLocation方法即可。如果还要在移动标记点时改变scale的大小，建议看这篇文章。问题：使用moveToLocation未生效。实现效果：点击标记点时移动标记点至地图中心。
微信小程序地图wx.createMapContext的moveToLocation
zhou_w_x的博客
05-28 1万+
<map id="myMap" style="width: 100%; height: 500rpx;" latitude="{{latitude}}" longitude="{{longitude}}" scale='18' markers="{{markers}}" show-location></map> data: { latitude: 45.76, ...
uni.createMapContext uniapp小程序 地图放大图标 动态切换图标
qq_47247479的博客
09-26 1657
uni.createMapContext uniapp小程序 地图放大图标 动态切换图标
微信小程序之地图组件
qq_34907249的博客
08-31 2797
官方提供好了 map组件直接使用即可，具体配置可以参考demo1、配置权限"desc": "请求获取地理信息"}}2、使用mapwx.getLocation() 可以获取当前位置，需要在小程序中申请，也可以使用demo中的方式获取(如下api获取上下文对象，再进行对应功能的获取)...
微信小程序 -- 解决MapContext.getCenterLocation(Object object)没有执行回调问题
Emily
04-21 3715
今天试了MapContext.getCenterLocation(Object object)，并没有执行成功success/失败fail的回调，很奇怪，之前用过，同样的代码复制过来就不生效了。 this.mapCtx = wx.createMapContext("myMap"); this.mapCtx.getCenterLocation({ success: function ...
微信小程序map组件结合高德地图API实现wx.chooseLocation功能示例
10-17
主要介绍了微信小程序map组件结合高德地图API实现wx.chooseLocation功能,结合实例形式分析了map组件调用高德地图API接口获取地理位置提示列表并返回location相关操作技巧,需要的朋友可以参考下
微信小程序中相机api_小程序开发API之相机wx.createCameraContext()
weixin_39568659的博客
12-19 1653
效果展示wx.createCameraContext()创建 camera 上下文 CameraContext 对象。返回值CameraContextCameraContextCameraContext 实例，可通过 wx.createCameraContext 获取。cameraContext 与页面内唯一的 组件绑定，操作对应的 组件。方法CameraContext.takePhoto(O...
小程序开发API之卡券wx.openCard、wx.addCard
M.Siebel
03-04 3440
wx.openCard(Object object) 查看微信卡包中的卡券。只有通过 认证 的小程序或文化互动类目的小游戏才能使用。更多文档请参考 微信卡券接口文档。 参数 object object.cardList 的结构 示例代码 wx.openCard({ cardList: [{ cardId: '', code: '' }, { cardId: '', ...
微信小程序开发demo-地图定位
10-29
微信小程序开发demo-地图定位wx.getLocation接口，测试时获取的经纬度一直不变 版本信息： 微信web开发者工具 v0.10.101100
小程序开发API之登录wx.login()、wx.checkSession()及获取openid、session_key、access_token
M.Siebel
02-27 1万+
用户登录 小程序可以通过微信官方提供的登录能力方便地获取微信提供的用户身份标识，快速建立小程序内的用户体系。 说明： 调用 wx.login() 获取 临时登录凭证code ，并回传到开发者服务器。 调用 code2Session 接口，换取 用户唯一标识 OpenID 和 会话密钥 session_key。（一般后台调用） 唯一标识（openid） 本次登录的会话密钥（session_ke...
uniapp使用map地图组件教学
qq_57263284的博客
07-22 8439
由之前描述可知，markers属性类型为Array，表示标记点用于在地图上显示标记的位置。这个数组属性，它里面有它的对象配置属性，分别是。
如何为微信小程序添加地理位置标记和地点搜索功能
qq_67153941的博客
05-03 481
微信小程序提供了地理位置标记和地点搜索功能，可以通过调用微信小程序的API实现。以上就是为微信小程序添加地理位置标记和地点搜索功能的详细介绍，希望对你有帮助。如有疑问，请随时追问。注意：在使用地图和地点搜索功能前，需要先在小程序管理后台开启相应的接口权限，并在。搜索成功后，获取到地点的经纬度、地址和名称，并在地图上添加标记。，可以在页面上展示地图，并在地图上标记特定的位置。获取地图实例，通过调用地图实例的方法来进行地图标记的操作。以上代码会在地图上添加两个标记，分别位于。获取当前位置的经纬度，然后调用。
微信小程序开发之路——地图调用，你得注意的几个坑
HouGISer的博客
08-04 2万+
文章目录现在前头开发工具版本如何调用？几个问题1. 地图组件的大小和定位2. 给地图添加控件3. 地图属性3.1 指南针3.2 比例尺3.3 显示带方向的当前定位点3.4 设置地图初始中心位置3.5 设置地图比例尺3.6 设置地图旋转角度3.7 设置地图倾斜角度3.8 允许3D楼块3.9 允许俯视3.10 允许缩放3.11 允许拖动3.12 允许旋转3.13 开启卫星图3.14 开启实时路况参考网...
微信小程序开发：实现地图导航功能
吃不胖.
10-08 6504
其中，id用于调用地图组件，latitude和longitude表示地图的中心点坐标，markers表示地图中的标记点，covers表示地图中的覆盖物，polyline表示地图中的折线图，show-location表示是否显示当前定位点，bindregionchange表示移动地图时触发的事件。其中，id表示标记点的唯一标识，latitude和longitude表示标记点的坐标，title表示标记点的名称，iconPath表示标记点的图标路径，width和height表示标记点的宽度和高度。
Map创建自定义图片图层，图片会随着地图缩放而缩放，uniapp、高德、腾讯、百度
qq_39891453的博客
09-06 9127
Map创建自定义图片图层，图片会随着地图缩放而缩放
微信小程序开发——map地图组件，定位，并手动修改位置偏差。
热门推荐
贝尔·格里屌斯的专栏
01-29 9万+
环境搭建 注册，获取APPID（没有这个不能真鸡调试） 下载微信web开发者工具（挺多bug，将就用） 打开微信web开发者工具，扫码登录，新建小程序，输入APPID，勾选创建quick start项目。 工程结构可以看到工程根目录中有个app.js，这里可以定义全局变量，通过getApp()获取。 项目中有了一些示例，已经有了获取用户信息的方法等。 开发地图定位，选择位置功能我们直接修改ind
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值