电竞比分网-中国电竞赛事及体育赛事平台

分享

地圖鉆取與聯(lián)動(dòng)

 新用戶57984925 2022-03-17

1. 概述

1.1 預(yù)期效果

  • 模板中包含地圖和表格,地圖可實(shí)現(xiàn)鉆取,表格中數(shù)據(jù)可以跟隨地圖鉆取省份進(jìn)行聯(lián)動(dòng)。

  • 模板中地圖與圖表進(jìn)行聯(lián)動(dòng),點(diǎn)擊地圖中某個(gè)城市,圖表展示該城市的數(shù)據(jù)。

如下圖所示:

A63711AC-52AB-4605-B658-663AFA15E93A.GIF

1.2 實(shí)現(xiàn)思路

通過設(shè)置參數(shù)聯(lián)動(dòng)「鉆取地圖」和其他組件,但聯(lián)動(dòng)其他圖表時(shí),由于地圖各層級(jí)數(shù)據(jù)需要先進(jìn)行匯總處理,所以圖表需要使用單元格數(shù)據(jù)源。

注:在普通報(bào)表中,無法直接在一張模板中實(shí)現(xiàn)圖表傳參給單元格,需借助網(wǎng)頁框控件,詳情可參考文檔 數(shù)據(jù)鉆取到當(dāng)前模板  。

2. 示例一

本示例使用內(nèi)置的「地圖」數(shù)據(jù)表進(jìn)行講解,其中「省份」字段既包含了省又包含了市。若數(shù)據(jù)中的省市區(qū)分別是三個(gè)字段,請(qǐng)查看示例二。

2.1 準(zhǔn)備數(shù)據(jù)

1)點(diǎn)擊設(shè)計(jì)器左上角「文件>新建決策報(bào)表」,新建空白模板。在決策報(bào)表左下方新增數(shù)據(jù)庫查詢 ds1,SQL 查詢語句為:SELECT * FROM 地圖 。如下圖所示:

Snag_2589e491.png

2)點(diǎn)擊設(shè)計(jì)器左上角「模板>模板參數(shù)」,添加一個(gè)模板參數(shù),雙擊參數(shù)名稱重命名為 province。參數(shù)是用于地圖聯(lián)動(dòng)時(shí)過濾數(shù)據(jù)的。

如下圖所示:

Snag_258cca34.png

2.2 設(shè)計(jì)鉆取地圖

2.2.1 拖入鉆取地圖

將「鉆取地圖」拖入決策報(bào)表 body 中,如下圖所示:
Snag_105e1560.png

2.2.2 地圖類型

編輯圖表,右側(cè)圖表屬性面板選擇「類型」,選擇「鉆取地圖>區(qū)域地圖」,地圖邊界選擇「中國」,GIS 圖層選擇「標(biāo)準(zhǔn)>遠(yuǎn)山黛」,其余設(shè)置默認(rèn)即可。如下圖所示:

Snag_3e8dfff.png

2.2.3 綁定數(shù)據(jù)

1)右側(cè)屬性面板選擇「數(shù)據(jù)>鉆取層級(jí)」,可設(shè)置鉆取層級(jí)屬性,詳情可參見:地圖鉆取 。這里我們就使用默認(rèn)設(shè)置即可,如下圖所示:

Snag_98948.png

2)選擇「數(shù)據(jù)>數(shù)據(jù)」,選擇「各層級(jí)分別指定」。這里根據(jù)讀取的地圖文件,默認(rèn)有 3 個(gè)層級(jí),我們只需要設(shè)置「第1層」和「第2層」的數(shù)據(jù)即可。詳細(xì)設(shè)置如下:

  • 第1層:選擇 ds1 數(shù)據(jù)集中「pid」字段,展示中國各個(gè)省的地圖數(shù)據(jù)

  • 第2層:選擇 ds1 數(shù)據(jù)集中「省份」字段,展示鉆取的省份下各市的地圖數(shù)據(jù)

2.3 設(shè)計(jì)報(bào)表塊

2.3.1 拖入報(bào)表塊

拖拽一個(gè)報(bào)表塊到鉆取地圖的右邊,適當(dāng)調(diào)整地圖與報(bào)表塊的尺寸比例。如下圖所示:

Snag_4f197c2.png

2.3.2 設(shè)計(jì)表格

表格根據(jù)點(diǎn)擊的地圖省市一一對(duì)應(yīng)顯示,并用柱形圖輔助展現(xiàn)數(shù)據(jù),柱形圖數(shù)據(jù)來源于單元格。

最終樣式如下圖所示:

Snag_3fb4db6.png

1)設(shè)置標(biāo)題

A1 單元格插入公式:if(len($province) = 0 || $province = '中國', '全國數(shù)據(jù)', $province + '數(shù)據(jù)')

公式說明:作為表格的標(biāo)題,可隨著 province 參數(shù)動(dòng)態(tài)變化,且當(dāng) province 為空或等于「中國」時(shí),標(biāo)題為全國數(shù)據(jù)。

2)數(shù)據(jù)單元格內(nèi)容如下表:

單元格
單元格內(nèi)容擴(kuò)展方向父格說明
A3ds1.G(省份)不擴(kuò)展左父格:默認(rèn) ,父格:默認(rèn)A3 單元格在添加過濾條件之后, B3 單元格無法默認(rèn)跟隨 A3 單元格展示數(shù)據(jù),故 B3 單元格需要通過過濾條件跟隨 A3 單元格,其他單元格左父格需設(shè)置為 B3 單元格
B3ds1.求和(銷售額)不擴(kuò)展左父格:默認(rèn) ,父格:默認(rèn)
C3

插入公式:

B3-D3-E3

不擴(kuò)展左父格:B3 ,父格:默認(rèn)
D3ds1.求和(運(yùn)營費(fèi)用)不擴(kuò)展左父格:B3 ,父格:默認(rèn)
E3ds1.求和(稅費(fèi))不擴(kuò)展左父格:B3父格:默認(rèn)

3)為了與地圖產(chǎn)生聯(lián)動(dòng),A3 單元格需要添加過濾條件:

雙擊 A3 單元格,選擇「過濾」,添加過濾條件為:(列名:省份)等于 F(x):if(len($province) = 0 || $province = '中國',ds1.select(省份, len(pid) = 0),$province)

條件說明:當(dāng) province 為空或等于「中國」時(shí),獲取 ds1 數(shù)據(jù)集中滿足「pid」為空的「省份」數(shù)據(jù),參數(shù)不為空時(shí)根據(jù)參數(shù) province 顯示數(shù)據(jù)。

如下圖所示:

Snag_6c2637.png

4)A3 單元格設(shè)置過濾條件之后, B3 單元格無法根據(jù) A3 單元格顯示數(shù)據(jù),故設(shè)置過濾條件使其跟隨 A3 單元格顯示數(shù)據(jù)。

雙擊 B3 單元格,選擇「過濾」,添加過濾條件為:(列名:省份) 等于單元格 A3。

如下圖所示:

Snag_25a841b3.png

5)設(shè)置條件屬性

給 A3 單元格設(shè)置一個(gè)「新值」條件屬性,實(shí)現(xiàn)當(dāng)參數(shù) province 為空或等于「中國」時(shí),A3 單元格顯示為字符串「全國」。

條件屬性:新值為字符串「全國」。條件為公式= len($province) = 0 || $province = '中國'  。

步驟如下圖所示:

1626162499192987.png

2.3.3 柱形圖綁定數(shù)據(jù)

柱形圖的數(shù)據(jù)來源選擇「單元格數(shù)據(jù)」,分類名 =A3 ,表示點(diǎn)擊的省份;系列名 =[B2:E2] ,表示 B2 單元格到 E2 單元格的數(shù)據(jù);值 =[B3:E3],表示 B3 單元格到 E3 單元格的數(shù)據(jù)。詳情可參見文檔:圖表單元格數(shù)據(jù)源 。

Snag_40c035c.png

2.4 聯(lián)動(dòng)設(shè)置

鉆取地圖和報(bào)表塊都已經(jīng)設(shè)置好后,如果要實(shí)現(xiàn) 聯(lián)動(dòng),則需要設(shè)置交互屬性。在鉆取地圖中設(shè)置超鏈的地方有兩處,分別是「鉆取」和「超級(jí)鏈接」。如下圖所示:

Snag_547cfb8.png

  • 鉆?。横槍?duì)鉆取地圖左上角的「鉆取目錄」設(shè)置超鏈,點(diǎn)擊目錄時(shí)即可聯(lián)動(dòng);若不設(shè)置,則點(diǎn)擊目錄無聯(lián)動(dòng)效果。

  • 超級(jí)鏈接:針對(duì)地圖區(qū)域設(shè)置超鏈,點(diǎn)擊地圖區(qū)域時(shí)即可聯(lián)動(dòng)。

2.4.1 鉆取目錄處添加超鏈

編輯地圖,右側(cè)屬性面板選擇「特效>交互屬性」,「鉆取目錄」點(diǎn)擊開啟,點(diǎn)擊「添加鏈接」按鈕,選擇「當(dāng)前表單對(duì)象」,選擇表格所在報(bào)表塊 report0,添加 province 參數(shù),值選擇「區(qū)域名」。如下圖所示:

Snag_53027a1.png

2.4.2 超級(jí)鏈接處添加超鏈

在下方「超級(jí)鏈接」處添加一個(gè)一樣的超鏈,如下圖所示:

Snag_5364ba6.png

注:AREA_NAME 是圖表自帶的參數(shù),對(duì)應(yīng)區(qū)域名稱。

2.5 效果預(yù)覽

2.5.1 PC 端

保存模板,點(diǎn)擊「PC 端預(yù)覽」,效果如 1.1 節(jié)預(yù)期效果所示。

2.5.2 移動(dòng)端

App 端和 HTML5 端均支持,效果如下圖所示:

883140F4-35B3-4763-89BB-3A72B74DF1F6.GIF

3. 示例二

本例針對(duì)數(shù)據(jù)表中省市區(qū)分別存放在不同字段的情況。僅使用內(nèi)置數(shù)據(jù)集作簡(jiǎn)單演示。

3.1 準(zhǔn)備數(shù)據(jù)

1)新建決策報(bào)表,新建內(nèi)置數(shù)據(jù)集,將名字修改為 ds1。示例數(shù)據(jù)如下圖所示:

Snag_25d34d5a.png

2)參考示例一 2.1 節(jié),設(shè)置模板參數(shù) province 。

3.2 設(shè)計(jì)鉆取地圖

3.2.1 鉆取地圖綁定數(shù)據(jù)

綁定數(shù)據(jù)使用「各層級(jí)分別指定」。如下圖所示:

注:綁定第 3 層區(qū)域名為「區(qū)」后,注意下區(qū)域名是否正確匹配。詳情請(qǐng)參見文檔:地圖模糊匹配 。

Snag_25d7f58d.png

3.2.2 設(shè)置超鏈

參考 2.4 節(jié)設(shè)置超鏈即可,這里不再贅述。

3.3 設(shè)計(jì)報(bào)表塊

1)表格樣式如下圖所示:

Snag_25e3f9c9.png

2)每個(gè)單元格的內(nèi)容、設(shè)置項(xiàng)及作用如下表所示:

單元格
內(nèi)容擴(kuò)展方向父格
說明
B1ds1.求和(銷量)不擴(kuò)展左父格:默認(rèn) ,上父格:默認(rèn)作用:在 province 參數(shù)為空或?yàn)椤钢袊箷r(shí),作為 B3、C3 單元格的「新值」顯示。所以設(shè)置完成后需要將第一行表格隱藏
C1ds1.求和(利潤)不擴(kuò)展左父格:默認(rèn) ,父格:默認(rèn)
A3插入公式 = if(len($province) = 0 || $province = '中國','全國',$province)不擴(kuò)展左父格:默認(rèn) ,父格:默認(rèn)
  • 因?yàn)槭纠龜?shù)據(jù)的省市區(qū)不在同一個(gè)字段,所以這里不能使用過濾的方式獲取地區(qū),而是通過公式獲取參數(shù) province 的值

  • 當(dāng) province 為空或?yàn)椤钢袊箷r(shí),單元格值顯示為「全國」,參數(shù)不為空則根據(jù)參數(shù)顯示

B3ds1.求和(銷量)不擴(kuò)展左父格:默認(rèn) ,父格:默認(rèn)需要設(shè)置過濾條件和條件屬性
C3ds1.求和(銷量)不擴(kuò)展左父格:B3 ,父格:默認(rèn)需要設(shè)置條件屬性

3)雙擊 B3 單元格,設(shè)置過濾條件為:(列名:省) 等于 $province or (列名:市) 等于 $province or (列名:區(qū)) 等于 $province 。 

如下圖所示:

Snag_2600c713.png

4)設(shè)置條件屬性

B3 單元格條件屬性如下圖所示,即當(dāng) province 為空或?yàn)椤钢袊箷r(shí),B3 單元格等于 B1 單元格的值。

Snag_26035475.png

同理 C3 單元格條件屬性如下圖所示,即當(dāng) province 為空或?yàn)椤钢袊箷r(shí),C3 單元格等于 C1 單元格的值。

Snag_2604fbad.png

5)柱形圖綁定數(shù)據(jù)原理可參考 2.3.3 ,具體如下圖所示:

Snag_2605f2af.png

3.4 效果預(yù)覽

保存報(bào)表,點(diǎn)擊「PC端預(yù)覽」,效果如下圖所示:

5B1BB67C-3518-46AA-880E-73A4A6A9A0BA.GIF

4. 模板下載

示例一:

已完成模板可參考:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Map\Chart\地圖鉆取與聯(lián)動(dòng).frm

點(diǎn)擊下載模板:地圖鉆取與聯(lián)動(dòng).frm

示例二:

已完成模板可參考:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Map\Chart\地圖鉆取與聯(lián)動(dòng)示例二.frm

點(diǎn)擊下載模板:地圖鉆取與聯(lián)動(dòng)示例二.frm

    本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息,謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊一鍵舉報(bào)。
    轉(zhuǎn)藏 分享 獻(xiàn)花(0

    0條評(píng)論

    發(fā)表

    請(qǐng)遵守用戶 評(píng)論公約

    類似文章 更多