功能概述

自定义地图组件支持使用用户自己绘制的地图绑定和呈现数据。

我们可以直接在设计器中绘制自定义地图，只需导入底图图片，进行描边和调整标记点，即可使用。

如下图所示，我们根据一张商场的平面图绘制并使用了可用于绑定数据的自定义地图。

实际应用中，我们可以根据不同的应用场景和底图绘制出多种自定义的地图，绘制完成后即可在仪表板中使用。

注意

这里需要注意的是，数据集中的地理位置名称必须与自定义地图中为每个区域的命名一致，这样数据才能匹配上。

文中以使用商场平面图作为底图绘制自定义地图为例为您讲解自定义地图组件的整个使用过程，包括使用设计器绘制自定义地图和在仪表板中使用的过程。

绘制自定义地图

1. 在门户网站的首页单击，选择创建自定义地图打开自定义地图设计器。

2. 单击导入图片按钮，可导入底图。

3. 随后点击右侧的绘图工具对图片进行描边，描边完成后，设置对应的区域名。

可以选择矩形或圆形工具直接绘制规则形状，也可以选择自由绘制。

4. 每绘制完成一个形状后，会弹出区域保存对话框。输入该区域的命名后，单击保存即可。

注意

区域的命名需与最终使用的数据集中的位置字段一致，这样才会使数据匹配上。

每个区域中有一个数据标记点，用于标记在仪表板中使用时数据标注显示的位置。如下图所示。 可以通过鼠标拖拽，调整数据标注点的位置。

另外，通过框选或安住Shift健选择多个形状后，单击鼠标右键可将形状组合。组合后共用一个数据标记点。

5. 全部绘制完成后，单击左上角的保存按钮，保存自定义的地图。

保存后，可在门户网站的资源分类中看到它。

准备数据

使用带有商场商铺名称的数据创建数据源和数据集，预览如下。

注意

请注意商铺名与自定义地图中为每个区域形状的命名需保持一致。

在仪表板中使用自定义地图

1. 添加自定义地图组件。

2. 选择自定义地图。

3. 绑定数据集和数据。

4. 在属性设置面板中设置组件显示样式。

比如设置填充基色和不透明度。

将数据标注显示出来。

按照需要可在属性设置中进一步设置图表样式，例如设置标题，字体大小颜色，图例，系列配色，提示等，这里不再一一介绍。

type=info

提示

进入组件的聚焦状态可以更方便一边设置属性，一边查看组件变化效果。

5. 预览并保存。