流式氣泡層是基礎平面地圖的子組件,支持獨立的樣式和數據配置,包括氣泡的大小、位置、顏色、動畫效果以及經緯度等,能夠以流式氣泡的形式表現地理位置上的點數據信息。本文介紹流式氣泡層各配置項的含義。

重要 當前為v2.x版本的流式氣泡層子組件指導文檔,如需查看該子組件v1.x版本的文檔內容詳情,請參見流式氣泡層(v1.x版本)

配置

單擊子組件管理下方的流式氣泡層,進入配置面板配置流式氣泡層的樣式和數據。
說明 如果子組件管理中沒有流式氣泡層,說明您還未添加流式氣泡層子組件,請參見地圖容器(v2.x版本)進行添加。
流式氣泡層配置面板
  • 搜索配置:單擊配置面板右上角的搜索配置,可在搜索配置面板中輸入您需要搜索的配置項名稱,快速定位到該配置項,系統支持模糊匹配。詳情請參見搜索資產配置
  • 可見級別:設置流式氣泡層的可見級別值,在設定的級別范圍內流式氣泡層可見,級別之外不可見。
  • 默認配置:設置流式氣泡圖標的圖片樣式路徑、圖片尺寸和圖標偏移量等參數。
    參數說明
    圖片路徑流式氣泡圖標的圖片。
    • 鼠標移動到圖片位置,單擊刪除可刪除當前圖片,然后單擊圖片區域或者拖動本地圖片到區域內即可添加一個圖標圖片。
    • 鼠標移動到圖片位置,單擊更改可重新上傳本地圖片。
    • 您也可以輸入圖片的URL地址,將遠程服務器上的圖片作為流式氣泡圖標。
    圖片尺寸設置圖標的寬度和高度,取值范圍為0~400,單位為px。
    圖標偏移量圖標相對于水平方向和垂直方向的偏移量,取值范圍為-400~400,單位為px。建議設置為圖標寬度的一半來水平居中,設置為圖標高度值的一半來垂直居中。
    浮框偏移量浮框相對于水平方向和垂直方向的偏移量,取值范圍為-400~400,單位為px。
    圓圈樣式設置圓圈的填充顏色、圓圈的半徑值、圓圈邊線顏色和邊線的粗細值。單擊圓圈樣式左側的眼睛圖標圖標,可控制圓圈樣式的顯隱。
  • 浮框配置:設置流式氣泡浮框的文本樣式、文本對齊和行高比例等參數。
    參數說明
    文本樣式設置浮框內文本的字體、文字粗細、字號和顏色。請參見顏色選擇器說明進行顏色修改。
    文本對齊設置流式氣泡浮框內信息的多行對齊方式,包括左對齊居中右對齊。僅當數據中的info信息設置為多行時有效。
    行高比例設置流式氣泡浮框的行高比例值。
    外邊距設置流式氣泡浮框內文本與浮框四邊的距離。
    背景配置設置流式氣泡浮框的背景顏色,內容的寬度,浮框圓角半徑值,數值越大圓角越圓。
    陰影設置流式氣泡浮框的陰影的顏色、陰影模糊度和陰影對于水平方向和垂直方向的偏移量,取值范圍為0~50,單位為px。
  • 動畫配置:設置流式氣泡浮框動畫的緩存、順序和冒泡數目等參數。
    參數說明
    緩存打開開關,系統會自動緩存您的氣泡數據,并且可以自定義緩存條數。當數據發生變化時,系統不會清空您已經緩存的數據。
    順序打開開關,系統按照數據的順序進行循環冒泡,關閉開關,系統進行隨機冒泡。
    冒泡數目流式氣泡每次冒泡的數量,當設置的數目小于數據條數時,系統采用循環冒泡的方式。
    平鋪時間流式氣泡平鋪動畫的持續時間,單位為s。
    停留時間流式氣泡平鋪動畫的停留時間,單位為s。
    消失時間流式氣泡平鋪動畫的消失時間,單位為s。

數據

流式氣泡層數據面板V2.x
表 1. 字段說明
字段說明
lat流式氣泡的緯度。
lng流式氣泡的經度。
info流式氣泡的文本信息,可自定義,支持使用</br>換行,例如自定義信息</br>自定義信息
表 2. 配置項說明
配置項說明
受控模式打開開關,資產初始化狀態下不請求數據,僅通過回調ID或藍圖編輯器配置的方法發起請求數據;關閉開關,可以使用自動更新請求數據。開關默認為關閉狀態。
自動更新請求選中后可以設置動態輪詢,還可以手動輸入輪詢的時間頻次。取消選中后則不會自動更新,需要手動刷新頁面,或通過藍圖編輯器和回調ID事件來觸發請求更新數據。
數據源單擊配置數據源,可在設置數據源面板中修改數據源類型和數據查詢代碼、預覽數據源返回結果以及查看數據響應結果,詳情請參見配置資產數據
數據過濾器數據過濾器提供數據結構轉換、篩選和一些簡單的計算功能。單擊添加過濾器,可在設置數據源面板配置數據過濾器腳本,詳情請參見過濾器使用說明
數據響應結果展示數據請求的響應結果。當數據源發生改變時,可單擊右側的刷新圖標 圖標,實時查看數據響應結果。

交互

此組件沒有交互事件。

藍圖編輯器交互配置

  1. 在畫布編輯器頁面,單擊基礎平面地圖子組件管理列表中流式氣泡層右側的導出到藍圖編輯器圖標。
  2. 單擊頁面左上角的藍圖圖標圖標。
  3. 在藍圖編輯器配置頁面,單擊導入節點欄內的流式氣泡層組件,在畫布中可以看到如下圖所示的流式氣泡層的藍圖編輯器配置參數。流式氣泡層V2.x藍圖編輯器參數
    • 事件
      事件說明
      當數據接口請求完成時數據接口請求返回并經過過濾器處理后拋出的事件,同時拋出處理后的JSON格式的數據。具體數據示例請參見畫布編輯器中組件右側配置面板數據頁簽的數據響應結果區域。
      當數據接口請求失敗時數據接口請求失敗時(請求失敗的情況可能是:網絡問題或接口報錯等)返回并經過過濾器處理后拋出的事件,同時拋出處理后的JSON格式的數據。具體數據示例請參見畫布編輯器中組件右側配置面板數據頁簽的數據響應結果區域。
    • 動作
      動作說明
      請求數據接口

      重新請求服務端數據,上游數據處理節點或圖層節點拋出的數據將作為參數。例如矢量散點層配置了API數據源為https://api.test,傳到請求數據接口動作的數據為{ id: '1'},則最終請求接口為https://api.test?id=1

      導入數據接口按組件繪制格式處理數據后,導入組件,重新繪制。不需要重新請求服務端數據。具體數據示例請參見畫布編輯器中組件右側配置面板數據頁簽的數據響應結果區域。
      顯示顯示組件,不需要參數。
      隱藏隱藏組件,不需要參數。