# 地图 华为云Astro大屏应用中的地图组件为二维地图，支持高德、百度、天地图和自定义地图。 在大屏设计页面，从"地图"中，拖拽"地图"组件至画布空白区域，如[图1]。 图1地图组件 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184456.png "点击放大") 图2边距样式说明 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184108.png) #### 卡片 卡片是指包裹图表组件的外层架构，可以理解为组件由卡片中基础元素（卡片标题、图表、卡片背景、卡片边框）和图表元素构成。 图3地图卡片 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184468.png "点击放大") - 背景 - 背景色：设置组件卡片的背景颜色。 - 边框：组件卡片边框设置，支持无边框、全边框和角边框三种样式。设置为全边框和角边框时，支持设置组件外圈边框的线型、圆角等。 - 样式：选择图片时，图片显示的样式，支持普通、居中、拉伸和平铺四种样式。 - 选择图片：使用本地的图片作为组件背景，支持新增目录和子目录，便于对图片进行分类管理。推荐使用JPG、JPEG、PNG或GIF格式的图片，且每张图片不能超过50MB。 - 特效：组件是否高亮显示，支持默认展示和跳转到页面时展示。 - 边距：组件中图表距离整个组件四边（上、下、左、右，如[图2]）的距离，默认为0，即铺满整个组件。 #### 配置 在配置中，设置地图组件的基本信息、热力图层、柱状图层和标签图层等。 图4地图配置 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184448.png "点击放大") - 地图基本配置 - 地图类型：地图第三方服务商，如天地图、高德地图和百度地图。 - 高德/百度/天地图密钥：地图第三方密钥，请自行到对应官网申请。 ![](https://support.huaweicloud.com/usermanual-astrocanvas/public_sys-resources/note_3.0-zh-cn.png) - 高德地图第三方密钥，请参考[高德开放平台](https://lbs.amap.com/api/webservice/guide/create-project/get-key)申请。 - 百度地图第三方密钥，请参考[百度地图开放平台](https://lbsyun.baidu.com/faq/search?id=299&title=677)申请。 - 天地图第三方密钥，请参考[天地图官网](http://lbs.tianditu.gov.cn/authorization/authorization.html)申请。 - 自定义地图：根据实际需求，自定义地图。如果开启自定义地图，请配置地图GeoJson数据链接地址或配置GeoJson数据素材。 - 地图中心经度：设置地图中心点的经度。 - 地图中心纬度：设置地图的中心点的纬度。 - 地图缩放级别：设置地图的缩放层级，最小级别为4，最大级别为19。 - 地图样式：设置地图基本样式模板。 - 热力图层配置 - 显示热力图层：是否显示热力图层。 - 数据标题：设置热力图层的数据标题。 - 显示类型 ：设置热力图层显示类型，如均分显示或区间显示。 设置为"均分显示"时，会显示所有数据，且区域数据从小到大，对应图层颜色由浅到深。 图5均分显示 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002158424493.png "点击放大") 设置为"区间显示"时，仅显示符合要求的数据，且区域图层颜色取决于其数据所处区间对应的颜色。 图6区间显示 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184464.png "点击放大") - 填充颜色：设置热力图层的填充颜色。"显示类型"为"均分显示"时，区域数据从小到大，对应图层颜色由浅到深。"显示类型"为"区间显示"时，区域图层颜色取决于其数据所处区间的对应颜色。 - 描边样式：设置省/直辖市描边样式，如虚线、点线等。 - 描边粗细：设置省/直辖市描边粗细，单位为px。 - 描边颜色：设置省/直辖市描边颜色。 - 柱状图层配置 - 显示柱状图层：是否显示柱状图层。 - 显示类型：设置柱图层显示内容，如均分显示或区间显示。 设置为"均分显示"时，会显示所有数据，且区域数据从小到大，对应图层颜色由浅到深。 图7均分显示 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184472.png "点击放大") 设置为"区间显示"时，仅显示符合要求的数据（如0\~10之间的数据），且区域图层颜色取决于其数据所处区间对应的颜色。 图8区间显示 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002158424469.png "点击放大") - 填充颜色：设置柱子的填充颜色。"显示类型"为"均分显示"时，区域数据从小到大，对应图层颜色由浅到深。"显示类型"为"区间显示"时，区域图层颜色取决于其数据所处区间的对应颜色。 - 柱子粗细：设置柱子的粗细，单位为px。 - 柱子长度比：数据最大值对应的柱子高度与该地图上1个纬度直线距离的比值，取值范围为\[0, 10\]。 - 显示标注：柱子上是否显示标注文字样式。设置为"显示"时，支持设置标注文字的字体、大小和颜色。 - 标签图层配置 - 显示标签图层：是否显示标签图层。 - 数据标题：设置标签图层的数据标题。 - 显示类型：设置标签的显示内容，如均分显示或区间显示。 设置为"均分显示"时，会显示所有数据，且区域数据从小到大，对应图层颜色由浅到深。 图9均分显示 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002158424509.png "点击放大") 设置为"区间显示"时，仅显示符合要求的数据，且区域图层颜色取决于其数据所处区间对应的颜色。 图10区间显示 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002158306109.png "点击放大") - 填充颜色：设置标签数据所处区间的对应颜色。均分显示时，区域数据从小到大，对应图层颜色由浅到深。区间显示时，区域图层颜色取决于其数据所处区间对应颜色。 - 数值字体：设置标签数值的字体、颜色和大小等。 - 数值后缀：设置标签数值的后缀，如%。 - 内容字体：设置标签内容的字体、颜色和大小等。 - 内容背景颜色：设置标签内容的背景颜色。 #### 数据 在数据中，配置地图的数据来源，更多介绍请参见[数据接入](https://support.huaweicloud.com/usermanual-astrocanvas/astrocanvas_05_6143.html)。 图11设置地图组件数据源 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184452.png "点击放大") - 自定义围栏数据：地图自定义围栏数据桥接器，数据中省/直辖市code一致，则认为属于同一围栏区域。预览或发布页面时，单击围栏区域，地图会下钻到围栏区域。若未配置该连接器，则下钻到单独省/直辖市。 图12自定义围栏数据 ![](https://support.huaweicloud.com/usermanual-astrocanvas/zh-cn_image_0000002123184476.png "点击放大") - 热力图层数据：热力图层数据桥接器/数据集，根据省/直辖市数值大小，热力图层颜色深浅不一。 - 柱状图层数据：柱状图层数据桥接器/数据集，根据省/直辖市数值大小，柱子颜色、高度不一。 - 标签图层数据：标签图层数据桥接器/数据集，以标签形式展示省/直辖市具体数据。 #### 交互 在交互中，配置地图与其他组件或页面之间的交互能力。更多交互介绍，请参见[交互设置](https://support.huaweicloud.com/usermanual-astrocanvas/astrocanvas_05_6140.html)。