Map

This widget calls Baidu map(speedy version) API, and only works on touch devices.

If the address positioning is not precise enough, you may use longitude/latitude positioning instead. The address will be dismissed if longitude and latitude is provided.

How to get longitude/latitude?Open Baidu map position picker, and click on the position. Then click on the copy icon on the upper right corner to get your longitude and latitude.

Demos

Theme: default

  <div data-am-widget="map" class="am-map am-map-default"
      data-name="云适配" data-address="北京市海淀区海淀大街27号亿景大厦3层西区" data-longitude="" data-latitude="" data-scaleControl="" data-zoomControl="true" data-setZoom="17" data-icon="http://amuituku.qiniudn.com/mapicon.png">
    <div id="bd-map"></div>
  </div>

Usage

Copy and Paste

Copy the codes in examples, and paste it to the <body> of the Amaze UI HTML template(Download);
Replace the contents in examples with your own contents.

Using Handlebars

The Handlebars partial of this widget is map. See Accordion for more details.

Allmobilize WebIDE

Drag the widget to the edit interface;
This widget don't need data-binding.

API

{
  // ID
  "id": "",

  // Customized class
  "className": "",

  // Theme
  "theme": "",

  // Options
  "options": {
    "name": "", // Name of this label
    "address": "", // Address. Used to position the label.
    "longitude": "", // Longtitude. Used to improve the precision.
    "latitude": "" // Latitude. Used to improve the precision.
    "zoomControl": Boolean, // Whether allow zooming.
    "scaleControl": Boolean, // Whether show scale on map.
    "setZoom": Number, // Zoom level.
    "icon": "" // Icon of label.
  }
}

Amaze UI 2.4

Web Components

Map

TOC