全部產品
Search
文件中心

DataV:地區熱力層(v4.x版本)

更新時間:Nov 19, 2024

本文介紹地區熱力層各配置項的含義。

圖表樣式

地區熱力層是基礎平面地圖 4.0的子組件,支援獨立的樣式、資料和互動配置,包括地區的標註、顏色、邊線、滑鼠互動事件以及位置資訊等,能夠以熱力地區的形式表現地理位置上的地區資訊。image

樣式面板image

  • 搜尋配置:單擊樣式面板右上方的搜尋配置項表徵圖image,可在搜尋配置面板中輸入您需要搜尋的配置項名稱,快速定位到該配置項,系統支援模糊比對。詳情請參見搜尋配置項

  • 快速樣式:地區熱力層子組件具備快速樣式功能,您可以根據實際應用情境選擇不同的樣式。

  • 通用:設定地區熱力層的通用配置參數項。

    參數

    說明

    可見層級

    設定地區熱力層的可見層級值,在設定的層級範圍內地區熱力層可見,層級之外不可見。

    不透明度

    設定地區熱力層的不透明度值,取值範圍為0~100,單位%。數值越大熱力層樣式越不透明。

  • 圖形:設定地區熱力層的圖形樣式參數項。地區填充顏色和邊線樣式參數。

    參數

    說明

    填充顏色

    資料中最大、最小及為空白的value值對應地區的顏色。請參見顏色映射器使用說明,配置不同地區的映射顏色樣式。

    描邊樣式

    地區熱力層各地區邊線的顏色、粗細和線的類型。

    說明

    線型支援數字輸入,如:4,4,第一個數字表示實線長度,第二個數字表示間隔長度。

    填充紋理

    單擊填充紋理左側的眼睛表徵圖表徵圖,可控制地區塊的填充紋理樣式顯隱。

    • 紋理形狀:地區紋理的形狀樣式,請參見形狀映射器使用說明,配置不同地區的填充紋理的映射形狀樣式。

    • 紋理顏色:請參見顏色映射器使用說明,配置不同地區的紋理映射顏色樣式。

    • 紋理縮放比例:地區紋理的縮放倍數,範圍為0.1~10。

  • 標籤:設定地區熱力層的地區的標籤配置項參數。

    • 顯示標籤:地區的標籤樣式,單擊顯示標籤左側的眼睛表徵圖表徵圖,可控制顯示標籤的顯隱。

    • 顯示方式:地區標籤的顯示方式,可選全顯點擊懸浮

    • 內容樣式:地區標籤的內容樣式參數配置項。

      參數

      說明

      每行樣式

      單擊每行樣式右側的imageimage表徵圖,添加或刪除一個每行內容樣式。 單擊imageimage表徵圖配置多個每行內容樣式的相片順序。單擊image表徵圖,即可複製當前選中內容樣式配置內容並新增一個同樣配置的每行內容。

      • 列欄位:行內容的欄位名稱,需要和資料面板中的欄位相匹配。

      • 欄位樣式:設定列欄位樣式,包括欄位的字型樣式、字型大小大小、顏色和粗細值。

      • 欄位首碼:設定欄位首碼的具體內容 、內容間隔值、字型、字型大小大小、顏色和粗細值。單擊欄位首碼左側的眼睛表徵圖表徵圖,可控制欄位首碼樣式的顯隱。

      • 欄位尾碼:設定欄位尾碼的具體內容 、內容間隔值、字型、字型大小大小、顏色和粗細值。單擊欄位尾碼左側的眼睛表徵圖表徵圖,可控制欄位尾碼樣式的顯隱。

      最大寬度

      設定標籤顯示的單行最大寬度,單位為px,欄位內容超出該長度將自動換行顯示。

      行高比例

      地區標籤的行高比例值,取值範圍為1~2。

      內容描邊

      地區標籤的內容描邊樣式,包括設定描邊的顏色和描邊粗細值,單擊內容描邊左側的眼睛表徵圖表徵圖,可控制內容描邊的顯隱。

      內容陰影

      地區標籤的內容陰影樣式,包括設定陰影的顏色、陰影模糊值和陰影位移度在x和y方向上的值,單擊內容陰影左側的眼睛表徵圖表徵圖,可控制內容陰影的顯隱。

    • 背景樣式:設定地區標籤的背景樣式參數,單擊背景樣式左側的眼睛表徵圖表徵圖,可控制背景樣式的顯隱。

      參數

      說明

      背景類型

      標籤背景的類型,可選向量圖片

      背景顏色

      設定標籤的背景顏色,僅在背景類型選擇向量時可配置。

      邊框樣式

      設定標籤邊框的樣式,包括邊框的線類型,線寬的值和顏色。僅在背景類型選擇向量時可配置。

      邊框圓角

      設定標籤邊框的圓角在四個方向的值,單位px。僅在背景類型選擇向量時可配置。

      圖片模板

      選擇背景圖片的模板樣式,僅在背景類型選擇圖片時可配置。

      不透明度

      設定背景圖片的不透明度值,取值範圍為0~100,僅在背景類型選擇圖片時可配置。

      內容邊距

      設定標籤中的內容距離上下左右四個方向的邊距值。

  • 互動:地區熱力層的互動配置項。

    • 圖形互動

      參數

      說明

      點擊聚焦

      單擊左側眼睛表徵圖表徵圖,可控制點擊聚焦互動功能的開啟或關閉。開啟後,單擊地區,會根據地區位置進行一定範圍比例的聚焦,僅在預覽或發布時才能看到效果。

      懸停樣式

      單擊懸停樣式左側眼睛表徵圖表徵圖,可控制懸停互動功能的開啟或關閉。開啟後可設定滑鼠移至上方時的地區的填充顏色、地區描邊線顏色和粗細,僅在預覽或發布時才能看到效果。

  • 條件:條件樣式說明。

    條件樣式:單擊右側的imageimage表徵圖,添加或刪除一個條件樣式。 單擊imageimage表徵圖配置多個條件樣式的頁面配置。單擊image表徵圖,即可複製當前選中條件樣式配置內容並新增一個同樣配置的條件樣式。具體樣式配置說明,請參見條件樹使用說明

    圖形:開啟開關,配置該樣式中的圖形配置項;關閉開關,無法配置該樣式下的圖形配置項。

    參數

    說明

    填充顏色

    單擊左側的眼睛表徵圖表徵圖,可控制是否應用該條件下的地區填充顏色。

    填充紋理

    單擊左側的眼睛表徵圖表徵圖,可控制是否應用該條件下的地區的填充紋理。

    • 紋理形狀:單擊左側的眼睛表徵圖表徵圖,可控制是否應用該條件下的地區的紋理形狀。

    • 紋理顏色:單擊左側的眼睛表徵圖表徵圖,可控制是否應用該條件下的地區的紋理顏色。

    • 紋理縮放比例:單擊左側的眼睛表徵圖表徵圖,可控制是否應用該條件下的地區的紋理縮放比例。範圍為0.1~10。

  • 自訂彈框樣式:設定地區熱力層內自訂彈框的樣式參數。

    參數

    說明

    彈框開關

    開啟開關,可以通過點擊懸浮觸發彈框。

    顯示方式

    設定地區熱力層彈框顯示的方式,可選,包括點擊懸浮兩種方式。

    相對位移

    設定彈窗在水平和垂直方向的相對位移像素距離,取值範圍為-1000~1000,單位px。

    文本樣式

    設定彈框內的文本樣式,包括文本的字型樣式、字型大小大小、顏色和文本粗細值。

    顯示空值

    開啟開關,在無info欄位或空info欄位對象上可以彈框顯示為“無資料”,關閉開關時,對於無info欄位的資料,互動不會彈出對應的彈框。

    彈框樣式

    • 內邊距:設定彈框文本的內容距離上下左右四個方向的邊距值。

    • 邊框樣式:設定彈框邊框的圓角值、線寬和顏色。

    • 背景顏色:設定彈框的背景顏色

    • 投影樣式:設定彈框投影的模糊色、模糊半徑、X位移和Y位移。

    • 關閉按鈕:開啟開關,地區熱力層的彈框顯示關閉按鈕和按鈕的顏色。

    • 指向箭頭:開啟開關,地區熱力層的彈框顯示指向箭頭。

資料來源面板image

  • 地理邊界geojson資料介面:通過配置地理邊界geojson資料介面,可將提取到的地區GeoJSON邊界資料應用到DataV中,配置方法如下。

    1. 資料提取。

      使用GeoJSON行政區劃邊界提取小工具DataV.GeoAtlas,最低可以提取區縣級邊界資料,地區adcode可以查閱省市區adcode與經緯度映射表,提取方法如下。

      • 省級:地區熱力層預設顯示為全國範圍內,各個省和直轄市地區熱力層資料,可以直接使用。

      • 地市級:以提取浙江省範圍內所有地級市邊界資料為例,提取方法如下圖所示。提取邊界資料

      • 區縣級:以提取肇慶市範圍內所有區縣邊界資料為例,提取方法如下圖所示。提取邊界資料

      • 鄉鎮街道及自訂地區:鄉鎮街道資料需要使用者自己擷取。根據需要自訂地區邊界,如中國內地可以分為東部地區、西部地區、華南地區、華北地區、華中地區五大區,可以根據對應包含的省級邊界資料合併得到。

    2. 資料應用。

      將提取到的資料配置到DataV中,配置方法如下。

      1. 選擇資料來源頁簽下的地理邊界geojson資料介面

      2. 設定資料來源面板中,選擇資料來源類型API

      3. 將提取到的JSON API粘貼到資料輸入區。

        上圖中提取到了肇慶市包含子領域的邊界資訊,樣本API如下。

        https://geo.datav.aliyun.com/areas/bound/441200_full.json
      4. 發布大屏專案,可以看到配置的地區熱力層。

    在資料配置的過程中,可能會出現地區文字標註有位移的問題,解決方案如下。

    • 查看下您的地區熱力層版本,目前可以使用的地區熱力層組件包括地區熱力層v0.2.4及以上版本。如果您使用的地區熱力層版本較低,需要先刪除該層,再重新添加。

    • GeoJSON提取工具中的資料已更新,需使用新的GeoJSON資料檔案。

    • 修改參數。

      肇慶市的區縣級GeoJSON資料為例,高要區文字標註有位移。地理位置位移

      1. 使用DataV.GeoAtlas邊界產生器工具,上傳肇慶市的區縣級GeoJSON資料檔案,在屬性工作表面板中添加customLabelPosition屬性參數。

        屬性工作表面板找到高要區的參數,編輯並新增一列customLabelPosition屬性列,添加自訂"customLabelPosition": [112.500801,22.927694]屬性。

        修改屬性修改屬性 查看修改的屬性查看修改的屬性

      2. 儲存修改後,將GeoJson檔案下載到本地,並將GeoJson檔案上傳到自己的伺服器或者OSS上,產生一個新的API。

      3. 選擇資料來源頁簽下的地理邊界geojson資料介面

      4. 設定資料來源面板中選擇資料來源類型API

      5. 將修改後新產生的JSON API地址粘貼到資料輸入區,設定完成後,高要區標註顯示正常。

  • 資料介面

    您可以通過配置資料介面,自訂地區熱力層的樣式。地區熱力層支援資料優先渲染。

    1. 選擇資料來源頁簽下的資料介面

    2. 設定資料來源面板中選擇資料來源類型待用資料,參數說明如下。

      欄位

      說明

      adcode

      地區的adcode編號,可通過DataV.GeoAtlas擷取。

      name

      可選,地區的名稱。

      colorField

      可選,地區的顏色映射欄位。

      textureShapeField

      可選,地區的紋理形狀映射欄位。

      textureColorField

      可選,地區的紋理顏色映射欄位。

      value

      可選,地區的值,與配置面板中填充顏色的最大值、最小值、無資料配置項配合使用,可控制對應地區的顏色。

      popupType

      可選,彈窗類型(需要搭配二次開發功能使用)。

      info

      可選,自訂彈窗內容。

資料項目配置

說明

資料來源

組件的資料來源中通過代碼編輯可視化編輯展示了組件所包含的資料欄位。也可以修改資料類型,靈活配置組件資料。

資料對應

當您需要自訂圖表欄位配置時,可以在資料對應模組設定不同的欄位對應內容,將這些欄位對應到組件對應的欄位上。無需修改資料來源中的欄位,就可以實現資料的即時匹配。也可以單擊image表徵圖對欄位分別樣式配置。

過濾器

開啟過濾器,選擇已建立的資料過濾器或建立資料過濾器,並配置資料過濾器指令碼,實現資料的篩選功能。詳情請參見管理資料過濾器

資料響應結果

即時展示了組件所使用的資料。當組件資料來源發生變化時,資料響應結果會對應展示最新的資料。如果系統反應延遲,您可以單擊右側的image表徵圖,查看資料響應結果,也可以單擊右側的image表徵圖,擷取組件的最新資料。您也可以單擊查看樣本,查看當前組件的響應結果樣本。

禁止載入態

勾選複選框,在組件更新和預覽資料看板時,將看不到組件初始化時的載入內容,去勾選則相反。預設為去勾選狀態。

受控模式

勾選複選框,組件初始化狀態下不請求資料,僅通過全域變數或藍圖編輯器配置的方法發起請求資料;去勾選複選框,可以使用自動更新請求資料。預設為去勾選狀態。

自動更新請求

勾選複選框,可以手動輸入輪詢的時間頻次設定動態輪詢。清除後則不會自動更新,需要手動重新整理頁面,或通過藍圖編輯器和全域變數事件來觸發請求更新資料。

進階面板image

開啟開關,開啟關聯全域變數功能。在單擊、雙擊、滑鼠移入或移出某個地區時,可觸發資料請求,拋出臨時變數,實現動態載入不同地區的資料。預設拋出所單擊地區的adcode值,具體配置請參見組件互動配置

藍圖互動

  1. 單擊頁面左上方的image表徵圖,進入藍圖頁面。

  2. 圖層節點頁簽下,添加當前組件至主畫布中。

  3. 查看藍圖配置參數。image

    • 事件

      事件

      說明

      當資料介面請求完成時

      資料介面請求返回並經過過濾器處理後拋出的事件,同時拋出處理後的JSON格式的資料。具體資料樣本請參見畫布編輯器中組件右側配置面板資料來源頁簽的資料響應結果地區。

      當地理邊界geojson資料介面請求完成時

      地理邊界GeoJSON資料介面請求返回並經過過濾器處理後拋出的事件,同時拋出處理後的JSON格式的資料。具體資料樣本請參見畫布編輯器中組件右側配置面板資料來源頁簽的資料響應結果地區。

      當內建topojson資料介面請求完成時

      內建topojson資料介面請求返回並經過過濾器處理後拋出的事件,同時拋出處理後的JSON格式的資料。具體資料樣本請參見畫布編輯器中組件右側配置面板資料來源頁簽的資料響應結果地區。

      點擊地區時

      當單擊地區熱力層某一塊地區時拋出。

      當地區被雙擊觸發

      當地區熱力層某一塊地區被雙擊觸發時拋出資料。

      滑鼠移入地區觸發

      當滑鼠移入地區熱力層的某一地區塊時觸發事件並拋出資料。

      滑鼠移出地區觸發

      當滑鼠移出地區熱力層的某一地區塊時觸發事件並拋出資料。

    • 動作

      動作

      說明

      匯入資料介面

      按組件繪製格式處理資料後,匯入組件,重新繪製。不需要重新請求服務端資料。具體資料樣本請參見畫布編輯器中組件右側配置面板資料來源頁簽的資料響應結果地區。

      請求資料介面

      重新請求服務端資料,上遊資料處理節點或圖層節點拋出的資料將作為參數。例如地區熱力層配置了API資料來源為https://api.test,傳到請求資料介面動作的資料為{ id: '1'},則最終請求介面為https://api.test?id=1

      切換顯隱

      切換組件顯示或者隱藏,不需要參數。

      顯示

      顯示組件,參考資料樣本。

      {
        "animationType": "",//動畫方式,可選值:fade,不填無動畫。
        "animationDuration": 1000,//動畫延遲,單位ms。
        "animationEasing": ""//動畫曲線
      }

      隱藏

      隱藏組件,參考資料樣本。

      {
        "animationType": "",//動畫方式,可選值:fade,不填無動畫。
        "animationDuration": 1000,//動畫延遲,單位ms。
        "animationEasing": ""//動畫曲線
      }

      更新群組件配置

      動態更新組件的樣式配置。需要先在組件的樣式面板中,單擊複製配置到剪貼簿,擷取組件配置資料。再根據需要在藍圖編輯器配置頁面的資料處理節點中更改對應樣式的欄位值。