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. jQuery元素属性attr设置多个键值或函数 删除属性removeAttr

    $("Element").attr(name) '取得第一个匹配的属性值,比如$("img").attr("src") $("El ...

  2. sqlserver 创建用户仅仅能訪问指定视图

    use crm --当前数据库创建角色 exec sp_addrole 'rapp' --分配视图权限 GRANT SELECT  ON veiw TO [角色] --指定视图列表 GRANT SEL ...

  3. spark读取 kafka nginx网站日志消息 并写入HDFS中(转)

    原文链接:spark读取 kafka nginx网站日志消息 并写入HDFS中 spark 版本为1.0 kafka 版本为0.8 首先来看看kafka的架构图 详细了解请参考官方 我这边有三台机器用 ...

  4. JDBC在Java Web中的应用——分页查询

    分页查询 通过JDBC实现分页查询的方法有很多种,而且不同的数据库机制也提供了不同的分页方式,在这里介绍两种非常典型的分页方法. 通过ResultSet的光标实现分页 通过ResultSet的光标实现 ...

  5. WF4.0(2)----设计工作流

    自从做了程序员,发现自己长胖了,而且自己的身体抵抗力也出了问题,最近身体不适,公司工作任务最近也很赶,上次写了WF4.0的简介,这次就工作中工作流设计的几种方式稍微总结一下.设计工作流包括四种方式:流 ...

  6. Remove Nth Node From End of List leetcode java

    题目: Given a linked list, remove the nth node from the end of list and return its head. For example, ...

  7. docker 基本原理及快速入门

    作者地址:青牛 什么是docker Docker 是一个开源项目,诞生于 2013 年初,最初是 dotCloud 公司内部的一个业余项目.它基于 Google 公司推出的 Go 语言实现. 项目后来 ...

  8. Python构造字符串

    不断报错 coercing to Unicode : 不要用+连接字符串,要用格式化字符串 None的问题:只能用 or “”的方式来解决了 not all arguments converted d ...

  9. GetProcAddress 使用注意事项

    使用 GetProcAddress Function 时,有以下几点需要特别留意: 1. 第二个参数类型是 LPCSTR,不是 : 2. 用 __declspec(dllexport),按 C 名称修 ...

  10. 一次真实的蓝屏分析 ntkrnlmp.exe

    故事背景: 话说我一直都是远程公司的电脑,在我晚上11点敲代码敲得正爽的时候,被远程的主机挂掉了,毫无征兆的挂掉了,我特么还好有闲着没事就ctrl + s保存代码的习惯,要不然白敲了那么久,我以为是公 ...