navigator

导航
属性名 类型 默认值 说明
url String   应用内的跳转链接
redirect Boolean false 是否关闭当前页面
hover-class String navigator-hover 指定点击时的样式类,当hover-class="none"时,没有点击态效果
注:navigator-hover默认为{opacity:0.7;},<navigator/>的子节点背景色应为透明色
示例代码:
index.wxss:

地图
属性名 类型 默认值 说明
longitude Number   中心经度
latitude Number   中心纬度
scale Number 1 缩放级别
markers Array   标记点
covers Array   覆盖物
标记点
标记点用于在地图上显示标记的位置,不能自定义图标和样式
属性 说明 类型 必填 备注
latitude 纬度 Number 浮点数,范围 -90 ~ 90
longitude 经度 Number 浮点数,范围 -180 ~ 180
name 标注点名 String  
desc 标注点详细描述 String  
覆盖物
覆盖物用于在地图上显示自定义图标,可自定义图标和样式
属性 说明 类型 必填 备注
latitude 纬度 Number 浮点数,范围 -90 ~ 90
longitude 经度 Number 浮点数,范围 -180 ~ 180
iconPath 显示的图标 String 项目目录下的图片路径,支持相对路径写法
rotate 旋转角度 Number 顺时针旋转的角度,范围 0 ~ 360,默认为 0
地图组件的经纬度必填, 如果不填经纬度则默认值是北京的经纬度。
目前测试在正式环境是调用不出来的,不清楚原因。
示例:
index.wxml:

属性名 类型 默认值 说明
hidden Boolean false 设置画布的显示/隐藏,hidden值为true表示隐藏,值为false表示显示
canvas-id String   canvas组件的唯一标识符
binderror EventHandle   当发生错误时触发error事件,detail = { errMsg: 'something wrong' }
注:
  1. canvas标签默认宽度300px、高度225px
  2. 同一页面中的canvas-id不可重复,如果使用一个已经出现过的canvas-id,该canvas标签对应的画布将被隐藏并不再正常工作
示例代码:
index.wxml:

小程序九:导航&地图&画布的更多相关文章

  1. 微信小程序——自定义导航栏

    微信头部导航栏可能通过json配置: 但是有时候我们项目需求可能需要自定义头部导航栏,如下图所示: 现在具体说一下实现步骤及方法: 步骤: 1.在 app.json 里面把 "navigat ...

  2. 微信小程序底部导航Tabbar

    1,底部导航栏这个功能是非常常见的一个功能,基本上一个完成的app,都会存在一个导航栏,那么微信小程序的导航栏该怎么实现呢?经过无数的踩坑,终于实现了,好了,先看看效果图. 2,对于底部导航栏,小程序 ...

  3. 小程序 - 底部导航栏“tabBar”

    小程序底部导航 1.app.json页面配置: { "pages": [ "pages/movie/movie", "pages/cinema/cin ...

  4. 微信小程序自定义导航栏组件,完美适配所有手机,可实现各种功能和情况

    背景 在做小程序时,关于默认导航栏,我们遇到了以下的问题: Android.IOS 手机对于页面 title 的展示不一致,安卓 title 的显示不居中 页面的 title 只支持纯文本级别的样式控 ...

  5. 小程序开发-Map地图组件

    Map组件 是原生组件,使用时请注意相关限制.个性化地图能力可在小程序后台"设置-开发者工具-腾讯位置服务"申请开通. 设置subkey后,小程序内的地图组件均会使用该底图效果,底 ...

  6. 微信小程序-基于高德地图API实现天气组件(动态效果)

    微信小程序-基于高德地图API实现天气组件(动态效果) ​ 在社区翻腾了许久,没有找到合适的天气插件.迫不得已,只好借鉴互联网上的web项目,手动迁移到小程序中使用.现在分享到互联网社区中,帮助后续有 ...

  7. 微信小程序添加外部地图服务数据

    先上效果: 缘起 使用微信小程序做地图相关功能的时候,有个需求是需要接入自己发布的地图服务.查看微信小程序地图组件文档,发现它对地图相关的支持很少,只有一些基础功能,比如添加点.线.面.气泡和一些常规 ...

  8. 获取不同机型微信小程序状态栏+导航栏高度

    获取不同机型微信小程序状态栏+导航栏高度 一. 前言 很多时候我们开发微信小程序,都需要先知道状态栏和导航栏的高度,才能去做其他功能 二. 获取微信小程序状态栏高度 用wx.getSystemInfo ...

  9. 微信小程序手绘地图实现之《Canvas》

    环境:微信SDK2.9+   + uniapp (可切换直接使用.map.js不限制环境) 正题: 先创建一个地图组件 <template> <view class="cu ...

  10. [微信小程序]在应用地图时,如何设置满屏(高度)

    微信小程序在做地图功能时 用常规的办法height:100%:来设置高度来占满屏幕是不行的 它不会生效 应该改用单位vh 例如 height:100vh 这样就可以是地图占满整个屏幕高度

随机推荐

  1. DirectX

    DirectX 9.0 Complete Software Development Kit (SDK) :(2002-12-19) 点击下载 DirectX 9.0 SDK Update - (Sum ...

  2. RobotFramework自动化3-搜索案例

    前言 RF系列主要以案例为主,关键字不会的可以多按按F5,里面都有很详细的介绍,要是纯翻译的话,就没太大意义了,因为小编本来英语就很差哦! 前面selenium第八篇介绍过定位一组搜索结果,是拿百度搜 ...

  3. eclipse 开发web程序,启动tomcat插件服务器的时候。部署目录在那里?

    不在tomcat-home/webapps/下面, 你做一个文件上传功能看看就知道了,临时目录一般是你的工作区间workspace\.metadata\.plugins\org.eclipse.wst ...

  4. 如何关掉UAC?

    你可能会问, 这也值得一写? 唉, 怎么说呢, 谁让咱一开始不会呢. ^_^ 好记性不如烂笔头嘛.   1. 打开一个command prompt, 输入msconfig回车. 2. 点击tools选 ...

  5. Search in Rotated Sorted Array II leetcode java

    题目: Follow up for "Search in Rotated Sorted Array": What if duplicates are allowed? Would ...

  6. JS中应用正则表达式转换大小写

    JS中应用正则表达式转换大小写,代码很简单,看代码: 以下首字母大写,其它字母小写 <script type="text/javascript"> function r ...

  7. 基于Packet Tracer 组建智能公司局域网

    背景及要求                                                                                               ...

  8. cocos2dx游戏存储举例及其注意事项

    今天白白跟大家分享一下cocos2dx中游戏的存储及需要注意的事项 cocos2dx中自带了存储类:CCUserDefault ,倘若需要存储的数据量教大的话,建议使用数据库来存储 现在先给大家看一下 ...

  9. iptables与SELinux

    iptables: 开始配置我们来配置一个filter表的防火墙.(1)查看本机关于IPTABLES的设置情况 [root@tp ~]# iptables -L Chain INPUT (policy ...

  10. C#.NET常见问题(FAQ)-如何给Listbox添加右键菜单

    1 拖一个ContextMenuStrip控件,然后可以直接在界面上编辑,也可以在FormLoad的时候动态添加   2 把这两个控件关联起来就可以实现listBox1的右键菜单跟ContextMen ...