矩形
該組件可用作其他組件展示內容的背景,或各種場景的拼裝圖案。本文介紹組件的詳細配置方法。
應用示例
拼裝出純展示圖案。
作為數字或文字的背景。
步驟一:添加組件
步驟二:配置樣式
在Web可視化編輯頁面右側樣式中,設置圓角、填充顏色和邊框樣式。
樣式中有多個配置項支持配置動態數據源,可選設備、接口、應用推送。其中,邊框顏色僅支持配置接口和應用推送數據源。
不同配置項支持的數據格式不同,數據源返回數據需與要求的數據格式保持一致。
配置項
數據格式
組件可見性
布爾型或枚舉型,設置對應的可見和不可見。
如果配置數據源為設備,僅支持選擇屬性,支持數據格式為單精度數字、雙精度數字、整數、布爾型和枚舉型。此時,支持設置設備離線時組件是否可見。若數據源的數據格式為數值型,需要轉換整數型為布爾值或轉換數字為枚舉型后設置對應的可見性。
說明在重復列表中使用該組件時,若需要根據設備物模型屬性設置組件可見性及對應設備離線時組件可見性,該組件數據源配置需關聯設備,配置方法如下:
重復列表數據源配置為設備,該組件可見性的數據源可配置為母組件數據源或設備。
重復列表數據源配置非設備,該組件可見性的數據源必須為設備。
填充顏色
布爾型或枚舉型。
如果配置數據源為設備,僅支持選擇屬性,支持數據格式為單精度數字、雙精度數字、整數、布爾型和枚舉型。此時,支持設置設備離線時組件內容的顯示顏色。若數據格式為數值型,需要轉換整數型為布爾值或轉換數字為枚舉型后設置不同值顯示的顏色。
說明在重復列表中使用該組件時,若需要根據設備物模型屬性設置顏色及對應設備離線時組件顯示顏色,該組件數據源配置需關聯設備,配置方法如下:
重復列表數據源配置為設備,該組件顏色的數據源可配置為母組件數據源或設備。
重復列表數據源配置非設備,該組件顏色的數據源必須為設備。
邊框粗細
整數,取值范圍為0~1000。
邊框顏色
RGB顏色的JSON格式。
說明其中a為可選參數,表示顏色透明度,取值范圍為0~100。
{ "r": 255, "g": 255, "b": 255, "a":0 }
邊框樣式
整數,取值范圍為0~2。對應線樣式的映射關系為(同下拉列表順序):
- 實線:0
- 虛線:1
- 點線:2
調整組件在頁面中的最終位置。有關組件通用樣式配置的更多信息,請參見樣式配置。
步驟三:配置交互動作
選中組件的交互頁簽,配置事件和交互動作。具體操作請參見交互配置。
例如,點擊組件,執行動作打開鏈接,即配置鏈接打開方式,展示鏈接的內容。
單擊頁面右上方的預覽,預覽和調試組件展示的數據和樣式。