区域下钻热力层

区域下钻热力层是基础平面地图的子组件，支持独立的样式、数据和交互配置，包括下钻区域的标注、边线、鼠标交互事件以及位置信息等，可直接作为省或直辖市级、地市级区域热力层使用。本文介绍区域下钻热力层各配置项的含义。

单击子组件管理下方的区域下钻热力层，进入配置面板配置区域下钻热力层的样式和数据。

信息

说明 如果子组件管理中没有区域下钻热力层，说明您还未添加区域下钻热力层子组件，请参见地图容器进行添加。

配置

• 基础设置
  • 可见级别：设置区域下钻热力层的可见级别值，在设定的级别范围内区域下钻热力层可见，级别之外不可见。
• 区域设置：设置区域下钻热力层的区域填充颜色和边线样式参数。

参数	说明
填充颜色	数据中最大、最小及为空的value值对应区域的颜色。
边线样式	区域下钻热力层各区域边线的颜色、粗细和线类型。

• 标注：设置区域热力层的区域的标注显示字段、文本样式参数。单击标注左侧的 图标，可控制标注的显隐。

参数	说明
显示字段	区域的标注字段，需要与地理数据中字段名称匹配。
文本样式	区域下钻热力层各区域文本标注的字体系列、文本粗细、字号、颜色和阴影色。
说明：请选择系统中的字体，如果您的系统中没有所选的字体，标注会使用默认字体。

弹框：在预览或发布页面，单击下钻区域出现的弹框样式。单击左侧的 图标，可控制弹框的显隐。

信息

说明 开启弹窗功能需要先设置 info 字段。

• info 字段：单击开关，开启 info 字段，设置 info 字段作为弹窗内容，该字段支持配置 html 标签；如果关闭 **info 字段开关，则兼容 name **和 value 字段内容作为弹窗内容。
• 事件类型：选择通过点击或鼠标移入事件作为弹框显示的类型。
• 配置选项：弹框样式的配置项内容，可选择父容器默认或自定义配置。
  • 父容器默认：系统自带的默认样式。
  • 自定义配置：自定义配置弹框的文本样式、行高比例、圆角半径等参数。

参数	说明
文本样式	设置弹框内文本的字体、文字粗细、字号、颜色和阴影色。
行高比例	设置弹框格式的行高比例值。
圆角半径	设置弹框的圆角半径值，数值越大圆角越圆。
外边距	设置弹框内文本与弹框四边的距离。
背景色	设置弹框的背景色。
关闭按钮	设置关闭弹框按钮的颜色、大小、按钮离顶部的距离和离右侧的距离。

• 交互配置

参数	说明
悬停样式	单击悬停样式左侧 图标，可控制悬停交互功能的开启或关闭。开启后可设置鼠标悬停时的区域的填充颜色、下钻区域边线颜色和粗细，仅在预览或发布时才能看到效果。
点击聚焦	单击左侧 图标，可控制双击聚焦交互功能的开启或关闭。开启后，双击下钻区域，会根据下钻区域位置进行一定范围比例的聚焦，仅在预览或发布时才能看到效果。

数据

• 默认区域
  1. 选择数据 > 默认区域，选择数据源。
  2. 在数据源下拉选项面板中，选择数据源类型为静态数据。

区域下钻热力层默认显示全国范围内各省和直辖市区域热力层数据，如下图所示。

信息

说明 区域area_id值可以查阅省市区adcode与经纬度映射表。

如果您需要使用地市级区域热力层，可修改area_id 值。
以贵州省为例，通过省市区adcode与经纬度映射表得到贵州省的area_id为520000，区域下钻热力层定位至贵州省范围内的所有地级市范围，可以作为地市级区域热力层来使用，其他省或直辖市以此类推。

上图中示例 JSON 代码如下

[
  {
    "area_id": 520000
  }
]

• 自定义区域数据：自定义区域数据包括area_tree和area_topo_json两个字段。

Uniplore 默认显示全国范围内的各省和直辖市的URL链接，层级关系为国家 > 省或直辖市 > 地市级 > 区县级，默认的示例数据如下。

[
  {
    "area_tree": "https://sh-conf.oss-cn-shanghai.aliyuncs.com/map/area_drill/area_tree.json",
    "area_topo_json": "https://sh-conf.oss-cn-shanghai.aliyuncs.com/map/area_drill/china.topo.new.json"
  }
]

您也可以修改默认数据来自定义下钻区域。以下以贵州省为例，为您展示自定义数据的配置方法。

• 参考默认区域的配置方法，修改默认数据的area_id为贵州省的area_id（520000）。

• 修改默认全国范围的area_tree.json文件，提取贵州省范围的数据。区域层级关系为省或直辖市 > 地市级 > 区县级。文件的部分数据内容如下图所示。 

• 将贵州省数据格式从对象修改为数组，即在数据外添加** [] **符号包括。并将数据内 area_id 字段类型改为字符串类型，在字段外添加符号""。

信息

注意

• 用户如果有自定义的层级关系，可以自定义area_id，只要保证area_id是唯一值。
• 由于获取的JSON数据量比较大，不支持静态数据等配置，只能通过URL链接来访问。

• 发布area_json数据文件，并获取URL。通过在线静态数据服务，将area_json发布成相应的文件，并获取URL，推荐您使用阿里云或腾讯云的在线静态数据服务以及 Uniplore 的静态资源管理服务 。关于 Uniplore 静态资源管理服务的介绍请参见 Uniplore-WS 服务使用说明。

信息

注意 通过该服务发布的URL链接必须使用HTTPS协议，并且必须使用SSL证书的域名。

• 获取topo_json数据文件。
  • 登入Uniplore Geo Atlas，获取得到贵州省范围的 JSON 数据（复制如下图所示 API 地址后打开该网址，另存为.json 文件即可。）

• 登入geojson.io网站，单击左上角Open > File，将获取到的浙江省范围的JSON数据添加到geojson.io右侧编辑框内。
• 单击左上角Save > TopoJSON，得到贵州省的topo_json文件。

信息

说明 自定义区域合并，可能需要使用turfjs.org这个方法合并两个相邻的区域，得到新的GeoJSON边界数据。

• 打开获取到的topo_json文件，在最前面加上贵州省的adcode（520000），并用:分隔，{ }整合，如下图所示。

上面得到的topo_json文件仅包含了浙江省各市级的区域数据，无法下钻到区县级，如果您需要下钻到区县级区域，需要继续配置topo_json文件。下面以贵阳市为例，为您介绍下钻到区县级的数据配置方法。

• 参考步骤a~步骤c，得到贵阳市的topo_json文件。
• 在贵阳市的topo_json文件前加上贵阳市的adcode（520100），并用:分隔，{ }整合，如下图所示。

• 将处理后的贵阳市的topo_json文件，复制粘贴到贵州省的topo_json文件后面，用英文逗号隔开（注意括号要对应）。

• 修改文件中的abcode字段的数据格式，在每个abcode字段的值外添加**""**符号，将其类型改为字符串。
• 发布topo_json数据文件，并获取URL。关于 Uniplore 静态资源管理服务请参见Uniplore-WS 服务使用说明。

重复第三个步骤，获取最终的topo_json文件的URL链接。

• 配置下钻热力层的自定义区域数据。

使用新发布出来的两个文件的URL，替换下钻热力层的自定义区域数据的URL，单击预览查看地图上的效果，即可完成自定义数据配置。

上图中的示例数据如下：

[
  {
    "area_tree": "http://uniplore-source.oss-cn-chengdu.aliyuncs.com/bigscreen/demo/guizhou_area/Guizhou_area_tree.json",
    "area_topo_json": "http://uniplore-source.oss-cn-chengdu.aliyuncs.com/bigscreen/demo/guizhou_area/guizhou.topojson"
  }
]

预览成功的效果图如下，双击贵阳市区域，可进入贵阳市地图页面。双击空白处，可回到贵州省地图页面。

使用同样的方式可配置其他省市级的下钻区域数据，数据的规律为国家 > 省或直辖市 > 地市级 > 区县级，即上一级必须包含下一级的区域数据（adcode和位置数据等）才可下钻。

• 映射数据：参见区域热力层数据。

交互

交互说明

交互	说明
当区域被单击触发	选中启用，开启组件交互功能。区域下钻热力层子组件拥有交互配置，可单击某个区域，触发数据请求，抛出回调值，实现在单击某个区域时，动态加载不同区域的数据。默认抛出所单击区域的adcode值，具体配置请参见[回调ID实现图表联动功能]。
当区域被双击触发	选中启用，开启组件交互功能。区域下钻热力层子组件拥有交互配置，可双击某个区域，触发数据请求，抛出回调值，实现在双击某个区域时，动态加载不同区域的数据。默认抛出所双击区域的adcode值，具体配置请参见[回调ID实现图表联动功能]。
**说明：**此回调ID不需要跟数据中的字段对应，默认回传区域的adcode。例如双击浙江省，会回传330000。
当区域上钻时触发	选中启用，开启组件交互功能。区域下钻热力层子组件拥有交互配置，可单击区域范围外侧空白处，触发数据请求，抛出回调值，实现区域上钻时，动态加载不同区域的数据。
默认抛出上钻区域的adcode值，具体配置请参见[回调ID实现图表联动功能]。

蓝图编辑器交互配置

• 在画布编辑器页面，单击基础平面地图子组件管理列表中区域下钻热力层右侧的 图标。
• 单击页面左上角的 图标。
• 在蓝图编辑器配置页面，单击导入节点栏内的区域下钻热力层组件，在画布中可以看到如下图所示的区域下钻热力层的蓝图编辑器配置参数。

• 事件

事件	说明
当默认区域请求完成时	默认区域数据接口请求返回并经过过滤器处理后抛出的事件，同时抛出处理后的JSON格式的数据。
当自定义区域数据请求完成时	自定义区域数据接口请求返回并经过过滤器处理后抛出的事件，同时抛出处理后的JSON格式的数据。具体数据请参见上文的[数据示例]。
当映射数据接口请求完成时	映射数据接口请求返回并经过过滤器处理后抛出的事件，同时抛出处理后的JSON格式的数据。具体数据请参见上文的[数据示例]。
当区域被点击触发	当区域下钻热力层某一块区域被单击时候触发的事件。
当区域被双击触发	当区域下钻热力层某一区域被双击时候触发的事件。
当区域上钻时触发	当区域下钻热力层某一区域上钻时候触发的事件。

• 动作

动作	说明
请求默认区域	重新请求服务端数据，上游数据处理节点或图层节点抛出的数据将作为参数。例如区域下钻热力层配置了API数据源为http://api.test，传到请求默认区域动作的数据为{ id: '1'}，则最终请求接口为http://api.test?id=1。
请求自定义区域数据	重新请求服务端数据，上游数据处理节点或图层节点抛出的数据将作为参数。例如区域下钻热力层配置了API数据源为[http://api.test](http://api.test)，传到请求自定义区域数据动作的数据为{ id: '1'}，则最终请求接口为htp://api.test?id=1。
请求映射数据接口	重新请求服务端数据，上游数据处理节点或图层节点抛出的数据将作为参数。例如区域下钻热力层配置了API数据源为http://api.test，传到请求映射数据接口动作的数据为{ id: '1'}，则最终请求接口为htp://api.test?id=1。
导入默认区域	按组件绘制格式处理数据后，导入组件，重新绘制。不需要重新请求服务端数据。具体数据请参见上文的数据示例。
导入自定义区域数据	按组件绘制格式处理数据后，导入组件，重新绘制。不需要重新请求服务端数据。具体数据请参见上文的数据示例。
导入映射数据接口	按组件绘制格式处理数据后，导入组件，重新绘制。不需要重新请求服务端数据。具体数据请参见上文的数据示例。
显示组件	显示组件，不需要参数。
隐藏组件	隐藏组件，不需要参数。
触发区域上钻	触发区域上钻到上一层地图