Amaze UI

Web 组件

Map 地图


本组件调用百度地图极速版 API,适用于触控设备,使用鼠标无法进行拖放等操作。

如果通过地址定位不准确,可以选择使用经纬度定位,设置经纬度定位以后,地址定位会被忽略。

经纬度获取:打开百度地图坐标拾取系统,在地图中找准要标识的位置,点击右上角【复制】按钮即可获取经纬度(逗号前面的为经度,后面的为纬度)。

组件演示

default(默认)

<div data-am-widget="map" class="am-map am-map-default" data-name="云适配"
data-address="北京市海淀区海淀大街27号亿景大厦3层西区" data-longitude="" data-latitude="">
  <div id="bd-map"></div>
</div>

使用方法

直接使用

  • 拷贝演示中的代码,粘贴到 Amaze UI HTML 模板(点此下载<body> 区域;
  • 将示例代码中的配置信息替换成自己的信息。

使用 Handlebars

本组件 Handlebars partial 名称为 map,使用细节参照折叠面板组件

云适配 WebIDE

  • 将组件拖入编辑界面,设置名称、坐标等信息;
  • 本组件无需采集数据。

API

{
  // id
  "id": "",

  // 自定义 class
  "className": "",

  // 主题
  "theme": "",

  // 选项
  "options": {
    "name": "", // 坐标名称
    "address": "", // 公司地址,地图定位的地址
    "longitude": "", // 经度
    "latitude": "" // 纬度
  }
}
侧栏导航
Amaze UI 微信
在微信上关注我们