设备地图可用于在地图上标示设备，并根据地理位置显示设备的属性数据。下文介绍组件的详细配置方法。

步骤一：添加组件

  1. 创建Web应用。详细操作请参见创建Web应用。
  2. 在Web应用编辑器中，单击最左侧的组件图标组件。
  3. 在画布左侧组件列表上方，输入设备地图，找到该组件，然后将组件拖拽到中间画布。

    有关组件添加的详细内容，请参见添加组件。

    设备地图

步骤二：配置数据源

  1. 单击右侧样式栏的编辑设备地图。
  2. 在设备地图编辑器的设备数据页面，配置地图需要展示的设备数据源。
    设备地图编辑器
    配置项 描述
    选择产品 支持多选，组件会自动导入所选产品下的所有设备。
    注意 必须为所选产品配置地理信息，否则设备在地图上不可见。
    下载坐标数据模板 当已添加产品下有设备缺少坐标时，出现该参数。
    1. 单击该按钮，下载一个Excel文件，该文件包含已添加产品和所有设备对应的ProductKey、DeviceName和位置。
    2. 在位置一列填写对应设备的经纬度（可使用高德开放平台经纬度拾取工具）并保存文件。
      说明 将设备的经纬度以英文逗号（,）分隔，逗号前填写经度，逗号后填写纬度。
    批量导入设备坐标 当已添加产品下有设备缺少坐标时，出现该参数。

    单击批量导入设备坐标，上传已填写好位置的Excel文件，则设备地图中显示对应设备的位置。

    如果需要清除设备位置，可在Excel文件对应设备后删除位置一列的值，然后重新上传该Excel文件即可。

    说明 如果Excel文件和设备的坐标属性都记录了设备经纬度，以设备坐标属性上报的位置为准。
    支持设备控制 选中复选框，支持通过设备气泡中的控制模式来下发设备操作指令。详细内容请参见下文的步骤三：配置样式。
  3. 可选：单击各产品右侧的设置按钮设置，配置各产品下设备展示样式。
    配置项 描述
    自定义设备点样式 开启后，可设置设备点图标的颜色、大小、不透明度和使用的图标。 默认和全局默认设备点配置一致。
    说明
    • 默认无自定义图标。单击右侧的添加按钮，可导入自定义的SVG格式图标。
    • 单产品中添加的自定义图标会自动同步到该项目下所有全局地图展示的自定义图标中。
    • 如果产品选中了某个自定义图标，支持删除。如果删除了自定义图标，该产品下设备显示系统默认图标。
    气泡属性展示 单击配置属性，设置设备点气泡展示的属性项。

    支持通过拖拽调整多个属性的前后位置。

步骤三：配置样式

  1. 单击最右侧功能菜单的地图展示，配置地图全局展示样式。
    如图所示，支持设置交互项显示、地图背景、默认设备点样式和气泡样式。
    说明
    • 默认设备点样式配置仅对新增和未自定义样式的设备生效。 配置方法与单产品一致。

      如果单产品中自定义设备点样式的配置与默认设备点样式配置不一致，则单产品的设备点展示自定义的设备点样式。

    • 如果产品开启了设备控制功能，或物模型定义了控制属性，设备点气泡中显示控制模式按钮。支持下发设备操作指令：单击控制模式，修改设备属性值，单击发送到设备。
    地图展示
  2. 单击页面右上角的保存图标保存。

（可选）配置地理空间

  1. 单击最右侧功能菜单的地理空间，配置设备的地理空间。
    地理空间示例
    配置项 描述
    +地理空间 选择项目内已配置的地理空间，支持多选。

    有关地理空间的配置操作，请参见空间。

    单击各空间右侧的设置按钮设置，可开启并配置自定义地理空间样式。

    在地图上显示 开启后，在地图上根据配置样式展示地理空间。

    默认样式配置对所有未自定义样式的地理空间生效。

    默认样式配置
  2. 返回到Web可视化编辑页面，选中设备地图组件，单击组件左上方的刷新按钮。
    画布中展示配置的地图。若需要体验交互动作，单击页面右上方的预览。