参考地图容器添加区域热力层子组件，并配置其参数。

样式



  • 标注
    • 标注字段：需要与地理数据中字段名称匹配。
    • 颜色：参考颜色选择器说明，修改标注的颜色。
    • 阴影色：参考颜色选择器说明，修改标注的阴影色。
    • 字体：单击下拉框，选择标注的字体。
      说明 请选择您系统中的字体，如果您的系统中没有所选的字体，标注会使用默认字体。
    • 字号：单击+或-号或手动输入数值，调整标注文字的大小。
  • 填充颜色：参考颜色选择器说明，修改数据中最大、最小及为空的 value 值对应区域的颜色。
  • 边线选项：修改区域热力层各区域边线的颜色、粗细和线型。
  • 交互配置
    • 悬停颜色：参考颜色选择器说明，修改鼠标悬停区域的颜色，仅在预览或发布时可以看到效果。
    • 点击聚焦：勾选后，启动点击聚焦功能。
    • 聚焦范围比：拖动滑块或手动输入数值，修改所点击区域的聚焦范围。
    • 回调 ID：设置组件回调 ID 的变量。
      说明 此功能已更新到 交互面板中， 样式面板的该功能将弃用，请尽快升级。新版本的交互功能支持配置多个字段。

数据

  • 区域面：通过配置区域面数据，可将提取到的区域 GeoJSON 边界数据应用到 DataV 中，配置方法如下：
    1. 选择区域热力层 > 数据 > 区域面。
    2. 选择数据源类型为 API。
    3. 获取区域边界数据的 GeoJSON API，粘贴到数据输入区，如下图所示。

    4. 发布大屏项目，可以看到配置的区域热力层。
    在数据配置的过程中，可能会出现 区域文字标注有偏移的问题，解决方法如下：
    • 查看下您的区域热力层版本，目前可以使用的区域热力层组件包括区域热力层 v0.2.4 及以上版本。如果您使用的区域热力层版本较低，需要先删除该层，再重新添加。
    • 您提取到的数据已更新，请使用最新的区域数据。
    • 修改参数：
      1. 通过 geojson.io 工具，在您区域边界数据的 API 中添加 customLabelPosition 属性参数。
        在数据源中找到文字偏移区域的 properties 参数，添加自定义 customLabelPosition 属性，如 "customLabelPosition": [112.500801,22.927694]。

      2. 将修改后的 API 保存到您的服务器上。
      3. 选择 区域热力层 > 数据 > 区域面。
      4. 选择数据源类型为 API。
      5. 将修改后的 JSON API 地址粘贴到数据输入区。
  • 映射数据：您可以通过配置映射数据，自定义区域热力层的样式。区域热力层支持数据优先渲染。
    1. 选择 区域热力层 > 数据 > 映射数据。
    2. 选择数据源类型为静态数据，参数说明如下：

      • area_id：区域的 adcode。
      • value：表示地区的值。与样式面板中填充颜色的最大最小值配置配合使用，可控制对应区域的颜色。
        说明 根据数据的 value 区间得出 scale 区间，从而计算从最大到最小的颜色渐变区间。
      • info：弹窗内容，为可选参数。
    3. 在数据源中配置 color（线颜色）、weight（线宽）、dashArray（虚线）、fillColor（填充颜色）等字段。

      地图中对应的区域将根据您设置的参数进行渲染。其中 fillColor 支持 red、#fff000、rgba(0,256,0,0.5) 三种形式设置参数。

交互

区域被点击触发：勾选启用，开启组件交互功能。区域热力层子组件拥有交互配置，可单击某个区域，触发数据请求，抛出回调值，实现在单击某个区域时，动态加载不同区域的数据。

默认抛出所单击区域的 area_id 值，具体配置请参考组件回调 ID 配置。