map
允许您将地图放置在页面上、设置静态位置或使用通过地理位置视图获取的另一个位置。
您可以通过设置配置属性来定义地图的外观和行为。
配置属性
在“配置”下,设置或修改视图的外观和行为属性。
- 屏幕大小
- 在属性名称旁边具有 "屏幕大小" 图标
的配置属性对于每个屏幕大小可以具有不同的值。 如果您未设置值,那么屏幕大小会继承下一个更大的屏幕大小值来作为其缺省值。
- 主题定义
- 主题定义指定视图的颜色和样式,并确定视图的外观。 您可以在主题编辑器中预览视图的外观。 请参阅 主题。
下表中列出了“地图”视图的外观配置属性:
| 外观配置属性 | 描述 | 数据类型 |
|---|---|---|
| 映射类型 | 地图的类型。 | MapType |
| 缩放级别 | 0(显示整个世界)与 20(显示具体到各栋建筑物的细节)之间的缩放级别。 | Integer |
宽度 ![]() |
地图的宽度,以像素 (px)、原始地图的百分比 (%) 或 em 为单位,例如 50 px、20% 或 4 em。 缺省单位为像素。 | String |
高度 ![]() |
地图的高度,以像素 (px) 或 em 为单位。 例如,50 px 或 4em。 缺省单位为像素。 | String |
下表中列出了“地图”视图的行为配置属性。 缺省情况下,将清除行为配置属性。
提示: 要获取用户的位置,请使用 "地理位置" 视图。 请参阅 地理位置 (Geo location)。
| 行为配置属性 | 描述 | 数据类型 |
|---|---|---|
| 禁用平移 | 阻止用户平移地图,这样可以固定地图位置。 | Boolean |
| 隐藏缩放控件 | 阻止用户缩放地图。 | Boolean |
| 隐藏地图类型控件 | 阻止用户更改地图类型。 | Boolean |
| 隐藏比例控件 | 阻止用户调整地图比例。 | Boolean |
| 隐藏旋转控件 | 阻止用户旋转地图。 | Boolean |
| 显示标记 | 显示或隐藏标记。 这要求设置纬度和经度配置属性。 | Boolean |
| 纬度 | 设置地图中心位置的纬度。 | Decimal |
| 经度 | 设置地图中心位置的经度。 | Decimal |
| 地图源 | 指定地图提供程序:OpenStreetMap 或 Bing Maps。 | String |
事件
对于“地图”视图,您可以激活以下类型的事件处理程序:
- On load 当页面装入时,例如
me.setWidth("100%") - On click 单击映射时,例如
${Map}.addMarker(latLng) - 单击标记时的 On marker click ,例如
console.log(marker.lng, marker.lat)
示例
要将地图设置为特定位置,请执行以下步骤。
- 将 OpenLayers API 视图拖至页面上。 有关此视图的更多信息,请参阅 OpenLayers API。
- 将“地图”视图拖至页面上。
- 在行为配置属性中,指定维度和经度。
- 将地图来源设置为 OpenStreetMap。提示: 您可以通过下列其中一种方法来查找位置的纬度和经度:
- 在 Google Web 站点上运行搜索。
- 使用专用 Web 站点,例如 http://www.latlong.net/ 。
- 使用 "地理位置" 视图,如 地理位置中所述。
- 设置 外观 属性。 例如,选择路线图类型并将缩放级别设置为 16。
OpenStreetMap 仅提供路线图视图。 Bing Maps 还会提供卫星视图和混合视图。
方法
有关可用方法的更多信息,请参阅 映射 JavaScript API 。
其他资源
有关如何创建 Coach 或页面的信息,请参阅 构建 Coach。
有关标准属性 (常规, 配置, 定位, 可视性和 HTML 属性) 的信息,请参阅 查看属性。