小程序-地图API
摘要
地图组件-map
注意事项&&Bug:
1.map 组件是由客服端创建的原生组件,它的层级是最高的。
2.请勿在scroll-view中使用map组件
3.css动画对map组件无效
4.map 组件使用的经纬度是火星坐标系,调用 wx.getLocation 接口需指定 type 为gcj02
1.map的属性
属性名:longitude - 类型:Number - 说明:中心经度 - 范围:-90~90
属性名:latitude - 类型:Number - 说明:中心纬度 - 范围:-180~180
属性名:scale - 类型:Number - 默认值:16 - 说明:缩放级别,取值范围5~18
属性名:markers - 类型:Array - 说明:标记点
属性名:covers - 类型:Array -说明:即将移除,请使用markers
属性名:polyline - 类型:Array -说明:路线
属性名:circles - 类型:Array -说明:圆
属性名:controls - 类型: Array - 说明:控件
属性名:include-points - 类型:Array - 说明:缩放视野以包括所有给定的坐标点
属性名:show-location - 类型:Boolean -说明:显示带有方向的当前定位点
属性名:bindmarkertap - 类型:EvenHandle - 说明:点击标记点时触发
属性名:bindcallouttap - 类型:EvenHandle -说明:点击标记点对应的气泡时触发
属性名:bindcontroltap - 类型:EvenHandle - 说明:点击控件时触发
属性名:binddregionchange - 类型:EvenHandle - 说明:视野发生变化时触发
属性名:bindtap - 类型:EvenHandle - 说明:点击地图时触发
属性名:bindupdated - 类型:EvenHandle - 说明:在地图渲染更新完成时触发
2.markers 标记点用于在地图上显示标记位置
属性:id - 说明:标记点id - 类型:Number - 必填:否 - 备注:markers点击事件回调会返回此id
属性:latitude - 说明:纬度 - 类型:Number - 必填:是 - 备注:浮点数,范围-90~90
属性:longitude - 说明:经度 - 类型:Number - 必填:是 - 备注:浮点数,范围-180~180
属性:title - 说明:标注点名 - 类型:String - 必填:否
属性:iconPath - 说明:显示的图标 - 类型:String - 备注:项目目录下的图片路径,支持相对路径写法,以‘/’开头则表示相对小程序根目录;也支持临时路径
属性:width - 说明:标注图宽 -类型:Number - 必填:否 - 备注:默认为图片实际宽度
属性:height - 说明:标注图高 - 类型:Number -必填:否 - 备注:默认为图片实际高度
属性:rotate - 说明:旋转角度 - 类型:String - 必填:否 - 备注:顺时针旋转的角度,范围0~360,默认0
属性:alpha - 说明:标注的透明度 - 类型:String - 必填:否 - 备注:默认1,无透明
属性:callout - 说明:自定义标记点上方的气泡窗口 - 类型:Object - 必填:否 - 备注:{content,color,fontSize,borderRadius,bgColor,padding,boxShadow,display}
属性:label - 说明:为标记点旁边增加标签 - 类型:Object - 必填:否 - 备注:{color,fontSize,content,x,y},可识别换行符,x,y原点是marker对应的经纬度
属性:anchor - 说明:经纬度在标注图标的锚点,默认底边中点 - 类型:Object - 必填:否 - 备注:{x,y},x表示横向(0-1),y表示竖向(0-1)。{x:.5 , y:1}表示底边中点
小程序-地图API的更多相关文章
- 微信小程序地图开发总结
最近在做一个微信小程序地图插件,通过传入起始位置名称和经纬度信息,就可以跳转到路线规划插件页面中,在该页面中,可以根据起始位置查询自驾,公共交通,步行等方式的路线信息,并且在地图上显示路线信息,在这个 ...
- 微信小程序--地图上添加图片
如何在微信小程序地图添加上,添加图片? 在微信小程序中,地图的层级最高,所以我们没有办法,通过定位,在地图上添加图片等信息; 处理办法: 添加控件:controls; 其中有个属性position,进 ...
- 微信小程序通过api接口将json数据展现到小程序示例
这篇文章主要介绍了微信小程序通过api接口将json数据展现到小程序示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧实现知乎客户端的一个重要知识前提就是,要知道怎么通过 ...
- 小程序常用API介绍
小程序常用API接口 wx.request https网络请求 wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 method:"GET&qu ...
- 图解微信小程序---调用API操作步骤
图解微信小程序---调用API操作步骤 什么是API API(Application Programming Interface,应用程序编程接口:是一些预先定义的函数,目的是提供应用程序与开发人员基 ...
- 把微信小程序异步API转为Promise,简化异步编程
把微信小程序异步API转化为Promise.用Promise处理异步操作有多方便,谁用谁知道. 微信官方没有给出Promise API来处理异步操作,而官方API异步的又非常多,这使得多异步编程会层层 ...
- 微信小程序 HTTP API
微信小程序 HTTP API promise API https://www.npmtrends.com/node-fetch-vs-got-vs-axios-vs-superagent node-f ...
- 微信小程序——地图
一:如何标点问题 地图模块需要用标点:官网API里面的wx.createMapContext(mapId, this)接口,且用官网Demo,小程序运行报错此时需要在wxml里面给map标签添加属性m ...
- 微信小程序地图模块
微信小程序的地图模块官方提供的API比较少,详情请见 官方文档 以下为一个示例 <!--pages/location/locati ...
随机推荐
- mysql存储引擎中InnoDB与Myisam的区别及应用场景
1. 区别: (1)事务处理: MyISAM是非事务安全型的,而InnoDB是事务安全型的(支持事务处理等高级处理): (2)锁机制不同: MyISAM是表级锁,而InnoDB是行级锁: (3)sel ...
- JAVA web项目转客户端(nativefier)
1.环境:windows 2.下载node.js 3.安装mode.js;记住安装目录 4.命令行进入安装目录 5.执行语句: npm install nativefier –g 进行安装 6.新建空 ...
- 获得Java中System对应一些属性值
public static void main(String[] args){ System.out.println("Java运行时环境版本:\n"+System.getProp ...
- ios之自定义UISwitch
系统自带的UISwitch是这样的: 既不能写字,也不能改颜色,于是在网上找到了这么一个自定义的Switch按钮,具体出处找不见了.记录一下,怕以后找不见了. 先看下效果图: 按钮的样式很多,可以文字 ...
- 【NOIP2017提高A组冲刺11.6】拆网线
和syq大兄弟吐槽题目不小心yy出了正解.. 最优的选法就是选两个两个相互独立的,欸这不就是最大匹配吗?那多的企鹅就新加一条边呗?不够的就除以2上取整呗? 欸?AC了? 树也是一个二分图,最大匹配=最 ...
- 如何用纯 CSS 创作一个永动的牛顿摆
效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/qKmGaJ 可交互视频教 ...
- 我的Python分析成长之路5
一.装饰器: 本质是函数,装饰其他函数,为其他函数添加附加功能. 原则: 1.不能修改被装饰函数的源代码. 2.不能修改被装饰函数的调用方式. 装饰器用到的知识: 1.函数即变量 (把函数体赋值给 ...
- 在loadrunner中用头文件的形式对字符串进行MD5加密操作
1.首先要有md5.h的头文件 2.然后在global.h中加入#include "md5.h" 3.在action中调用md5.h中的Change_to_Md5(const ch ...
- <题解>洛谷P3385 【模板】负环
题目链接 判断一张图中是否存在关于顶点1的负环: 可以用SPFA跑一遍,存在负环的情况就是点进队大于n次 因为在存在负环的情况下,SPFA会越跑越小,跑进死循环 在最差的情况下,存在的负环长度是“n+ ...
- IDEA避免JAVA文件自动引入import.*包
Intellij Idea工具在java文件中怎么避免import java.utils.*这样的导入方式,不推崇导入*这样的做法!Editor->Code Style->Java-> ...