Successfully!

Error!

【D】自定义钻取地图

  • Last update:  2020-08-26
  • 1. 概述

    1.1 应用场景

    钻取地图在普通地图的基础上,实现了钻取交互式数据查询效果。通过点击操作,可以钻取国家>省>市>区等不同地理层级的数据。

    自定义钻取地图是钻取地图的一种,不同的钻取层级可以自定义地图类型( 区域地图或点地图 )。自定义钻取地图展示效果如下图所示:

    1590730733862729.gif

    1.2 图表特点

    自定义钻取地图可以给不同的钻取层级设置不同的地图类型,满足不同场景下的用户需求,具有较高的图表自由度。

    2. 属性介绍

    2.1 类型

    以 单元格元素 或 悬浮元素 插入图表时,图表类型选择自定义地图,如下图所示:

    2020-05-24_20-13-19.png

    2.2 数据

    自定义地图数据绑定的详细介绍可以参见文档:图表数据

    自定义地图数据绑定部分特殊配置项如下:

    1)钻取层级

    设置钻取层级及该层级对应的地图类型,如下图所示:

    • 钻取层级关系:此处钻取层级是根据图层设置处选择的地图边界显示的,此处地图边界选择为中国,展示的是中国下的省市层级。

    • 层级属性:地图边界为world时,最多支持 5 层数据钻取,地图边界为中国时,最多支持 4 层数据钻取,层级数根据地图边界大小依次递减。第 1 层缩放等级默认为自动,其余几层可设置缩放等级。因本图表为钻取自定义地图,此处展示类型可选择区域地图、点地图

    2020-05-28_22-46-13.png

    2)数据

    • 数据:分为底层数据汇总各层级分别指定两种,底层数据汇总可自动选择对应层级的数据绑定关系,各层级分别指定需设置 4 个层级的数据绑定关系。

    • 数据来源:分为单元格数据数据集数据两种,可根据需求选择数据来源。

    • 区域名:此处需设置数据集对应区域名匹配,此处需匹配到帆软内置数据库区级行政单位名称。

    • 系列名:分为使用字段名和字段值两种,需设置字段名、系列名、汇总方式属性。

    • 区域名匹配:用户自定义区域名和图表内置区域名进行模糊匹配,详细介绍参见文档:地图模糊匹配

    1590322490370484.png

    2.3 样式

    基础通用样式的介绍参见文档:图表样式

    自定义地图的样式>系列有特殊设置项,需单独介绍,如下图所示:

    • 空值颜色:此处可设置地图数据为空区域的填充颜色,支持自定义颜色,此处为深色。

    • 不透明度:此处可设置空值区域的不透明度,可选择 0~100 ,此处为 75 。

    • 点样式:此处可设置点地图数据点的样式,共有默认、散点、气泡、自定义图片4种样式。

    • 大数据模式:此处可设置是否开启大数据模式,默认为关闭 。

    • 闪烁动画:此处可选择是否开启闪烁动画,开启后可设置运动周期。

    1589894999304542.png

    2.4 特效

    基础通用特效设置参见文档:图表特效

    自定义地图的特效>钻取是特殊设置项,需单独介绍,如下图所示:

    • 钻取目录:此处可选择是否开启钻取目录,默认为开启,开启后可在图表左上角看到层级目录。

    • 字符:此处可设置目录的字体、大小、颜色、粗体、斜体属性。

    • 背景:此处可设置目录的背景色,以及背景色的不透明度。

    • 选中色:此处可设置当前选中目录的背景色,以及背景色的不透明度。

    • 添加链接:此处可对目录添加链接。

    1589894774430186.png

    3. 示例

    3.1 制作地图 JSON

    制作地图 JSON 的目的是为了自定义一个钻取层级关系,示例制作一个华东地区的钻取层级,用于绑定钻取层级关系。

    3.1.1 新建地理信息

    管理员身份进入决策平台,点击管理系统>地图配置>地理信息>world>添加目录,新增中国(大区),中国(大区)下新增华东,华东下新增各省市,如下图所示:

    1590504650556656.png

    3.1.2 区域地图制作

    1)选择中国(大区)>区域>+(放大地图)>多边形,选一个点作为起始点,根据华东地区的边缘省的边界线进行描边。

    如果描边出错,可点击删除上一个画的点进行删除,最后一个点需要跟起始点重合,然后完成华东地区的绘制。

    1590553980960051.png

    2)绘制完成后,可输入当前区域名中心点坐标,点击保存,完成华东区域的绘制。

    1590554353389356.png

    3)华东地区的区域地图保存完成,如下图所示:

    1590556742325677.png

    3.1.3 点地图制作

    1)选择华东>点>坐标点,依次选择各省市的省会作为点地图的中心点,填写该中心点对应的区域名,保存华东地区各省市的点,如下图所示:

    1590555937151546.png

    2)点地图绘制保存完成后,如下图所示:

    1590556383670520.png

    3.1.4 JSON 文件存储路径及下载

    绘制好地图保存后,JSON 文件自动保存到%FR_HOME%\webroot\WEB-INF\assets\map\geographic\world路径下,如下图所示:

    点击下载制作好的 JSON 文件:华东地图JSON文件.rar

    2020-05-29_13-58-44.png

    3.2 报表设计

    3.2.1 准备数据

    新建内置数据集公司2019年华东地区各省市营业收入,如下图所示:

    2020-05-29_13-22-53.jpg

    3.2.2 插入图表

    合并一片区域单元格,右键选择 A1 单元格,点击单元格元素>插入图表>钻取地图>自定义地图,如下图所示:

    2020-05-24_20-13-19.png

    3.2.3 图层设置

    选择类型,地图边界选择中国(大区),GIS图层下拉选择深蓝,如下图所示:

    2020-05-28_22-45-22.png

    3.2.4 数据绑定

    绑定图表数据,如下图所示:

    1)选择数据>钻取层级关系,展示图层对应的地区(国家、省、市、区)树状列表,层级属性缩放等级选择自动,展示类型可选择区域地图、点地图

    2020-05-28_22-46-13.png

    2)选择数据>数据,选择区域名,点击设置按钮,设置区域名匹配到内置数据库中存有区域对应字段。

    1589813324278983.png

    3)设置地图模糊匹配,如下图所示:

    2020-05-29_13-24-11.jpg

    注 1:在 FineReport 的内置数据库中存有区域对应字段,即表示地图的区域名跟数据库中存有的区域名的对应关系。

    注 2:如果数据库中的区域名称跟设计器中内置的地图区域名称对应不上,在使用过程中就会使用默认的区域对应关系,则无法获取到数据库中区域的对应数据。

    3.2.5 样式设计

    1)选择样式>图例>形态>渐变色,设置渐变色的颜色,划分为 4 个阶段,标签格式选择自定义,如下图所示:

    1589895038242966.png

    2)选择样式>标签,区域地图勾选区域名,字体设置为白色,点地图勾选区域名、值,字体设置为白色,如下图所示:

    1589896587117515.png

    3)选择样式>系列,分别设置区域地图、点地图的属性,如下图所示:

    1589894999304542.png

    4)选择样式>背景,图表区域的外边框颜色默认为灰色,如下图所示:

    1589895144710485.png

    5) 选择特效>钻取目录,点击开启,如下图所示:

    1589894774430186.png

    6)闪烁动画(拓展)

    选择特效>条件显示,选择区域地图,点击+添加条件属性,点地图无需设置,如下图所示:

    2020-05-24_20-21-53.png

    3.3 效果预览

    1)PC端

    保存模板,点击分页预览,效果如1.1应用场景中所示:

    2)移动端

    91860CEDCA0A0517D3441E0932E70732 (1).gif

    4. 模板下载

    已完成模板参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\BasicChart\钻取自定义地图.cpt

    点击下载模板:钻取自定义地图.cpt

    Attachment List


    Theme: 下架文档
    Already the First
    Already the Last
    • Helpful
    • Not helpful
    • Only read

    Doc Feedback