地图组件

地图组件支持用户够根据具体业务需求精准调整地图的可视区域，用户可以灵活设置地图包括缩放层级、地理位置以及地图的展示区域。

价值

1. 灵活配置：用户可以轻松设置地图的显示范围和缩放层级，确保地图内容按业务需求准确展示。
2. 多点标记：支持在地图上添加一个或多个标记点，帮助用户清晰展示不同地点的信息，便于进行位置管理和分析。

使用场景

地图组件根据地理位置（经纬度）的数据，显示对应位置信息，并执行用户点击标记点后的行为，通常用于需要展示当前地理位置如公司地址信息或导航类应用中。

使用说明

1. 地图服务商注册账号获取API key

1. 前往高德地图开放平台（https://lbs.amap.com）注册账号，配置应用后生成API Key和密（小程序端已内置腾讯地图服务，无需配置API）
2. 在项目配置-全局设置-地图API密钥，填入对应的API key和安全密钥

2. 配置地图组件

2.1 创建地址信息数据表

1. 在数据库中按照业务逻辑创建一张【地址信息】表。常见需要字段有：【Text类型：标记点名称】、【图片类型：标记点图标】、【经纬度类型：标记点经纬度】

2.2 地图配置

1. 缩放层级：地图显示范围，默认11，1-19可选。数字越小，显示范围越大。（如图所示，缩放层级为1则地图将显示整个地球）
2. 显示周边信息：开关打开后，地图将显示周边位置信息
3. 显示位置信息：开关打开后，地图将展示用户当前所在的位置
4. 中心点：配置后，地图将按照中心点为圆心展示。当用户没有配置中心点时，默认以北京天安门为中心点。

2.3 标记点配置

1. 入口：打开标记点开关，进入标记点配置面板

2. 数量：单个标记点和多个标记点的区别在于多标记点需要配置坐标点的数据源以获取多个坐标点经纬度。

   1. 当数量选择单个时，用户只需要绑定经纬度坐标。
   2. 多标记点：当数量选择为多个时，需要在页面上配置数据源为远程数据，在数据源输入框绑定该远程数据，经纬度配置项通过组件内数据绑定。

3. 图标样式：支持用户上传和数据绑定标记点的样式以及修改样式大小。

4. 标记点名称：支持用户手动输入或绑定标记点的名称。

5. 标记点点击时行为

   1. 用户可以通过坐标点点击时行为配置出符合业务逻辑的交互，例如点击对应标记点时展示弹窗。

地理位置/经纬度获取步骤

为了国家安全，在国内的任何地图上获取到的坐标都不是准确的坐标，会有一定量的偏移，为了在Zion中添加准确的坐标位置，需要进行下列的转换操作才能实现

• 登录高德地图API：https://lbs.amap.com/tools/picker ， 通过关键字搜索位置，复制坐标结果

• 登录坐标转换地址：https://tool.lu/coordinate/ ，按照以下四个步骤进行地理位置坐标的转换，步骤4获取的就是准确的坐标

• 在Zion中上传“经纬度”类型的数据时，只需要将步骤4中的经纬度粘贴到对应的输入框中即可

功能边界

1. 地图组件中心点为空时，默认显示天安门位置
2. 小程序端默认使用腾讯地图服务，网页端默认使用高德地图服务
3. 地图组件只用于显示位置信息，不可点击获取位置