基础类组件包含时间组件、文本组件、文本列表组件、指标组件、图标组件、图片组件、视频组件、视频增强组件、iFrame 组件、幻灯片组件等;点击左侧边栏中的“组件”,在“基础”分类下选择希望添加的组件,通过拖拽的方式即可添加到大屏中:
时间组件
时间组件可以展示当前时间,以增强大屏的实时性。
时间组件的配置项如下:
- 时间类型:显示时间的方式,默认为“日期+时分秒+星期”
- 字体:时间组件中文本的字体系列,默认为微软雅黑
- 字体大小:时间组件中文本的字体大小,默认为 18 像素
- 字体颜色:时间组件中文本的字体颜色,默认为白色
- 背景:时间组件的背景设置
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 背景图片:组件的背景图片,可直接选择大屏内置的图片素材作为背景或添加自定义的背景图片,自定义背景图片时支持通过输入图片地址和上传图片两种方式添加,您还可以设置图片重复效果
- 高亮样式:文本组件高亮时的样式,具体设置项与普通文本的设置项相同
- 尺寸:时间组件的尺寸,单位为像素
文本组件
文本组件可以添加一段文字,用于大屏的辅助性说明等。
文本组件的配置项如下:
- 数据类型:文本的数据源,支持静态数据与选择数据:
- 静态数据:在“文本内容”中输入一段文字,即可在大屏中添加一段静态文本
- 选择数据:选择大屏中的已有数据作为数据源
- 超链接:为文本添加超链接,点击文本可跳转到链接地址
- 跳转窗口:超链接跳转窗口的形式,支持“新建窗口打开”、“当前窗口打开”、“父窗口打开"、“TOP 窗口打开”等选项
- 文本:
- 字体:文本的字体系列,默认为微软雅黑
- 字体大小:文本的字体大小,默认为 18 像素
- 字体颜色:文本的字体颜色,默认为白色
- 对齐方式:文本的对齐方式,包括居中、左对齐、右对齐等
- 字体粗细:字体的粗细设置,包括纤细、标准、加粗等
- 字体行高:每行文本的高度设置,单位为倍数或像素
- 首行缩进:文本的首行缩进值,单位为像素
- 背景:文本组件的背景设置
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 背景图片:组件的背景图片,可直接选择大屏内置的图片素材作为背景或添加自定义的背景图片,自定义背景图片时支持通过输入图片地址和上传图片两种方式添加,您还可以设置图片重复效果
文本列表组件
文本列表组件可在地图大屏中添加数据表格。
文本列表组件的配置项如下:
- 数据来源:文本列表的数据源
- 地图图层:如果添加的地图组件中的地图图层带有数据记录时,可以添加该图层中记录的数据
- 公开数据:iPortal 中公开的数据
- 我的数据:所有者为自己的数据
- 时序数据:支持固定时间段和相对时间段(最近时间)两种类型的时序数据,数据响应格式支持 GeoJSON/JSON,响应结果应为对象,对象的键值(key)为 unix timestamp
- 服务:支持 iServer REST 地图服务、iServer REST 数据服务,以及 GeoJSON/JSON 等格式的第三方服务,以 JSON 格式为例,示例如下:
{
"data": [
{
"A1": "a1",
"B1": "b1"
},
{
"A2": "a2",
"B2": "b2"
}
]
}
服务类型数据特有的配置项如下:
-
- 使用 iPortal 代理请求:未勾选时会基于浏览器客户端发送请求,勾选后会由 iPortal 服务器发送请求,适用于客户端与服务器端网络环境不同或跨域访问限制等情形,您可以根据实际情况进行选择
- 定时刷新:可设置时间间隔定时刷新数据,单位为秒
- 列表内容:文本列表的内容设置
- 数据:单列数据的内容设置
-
- 表头:文本列表组件中显示的表头
- 数据列:选择需要在文本列表中展示的数据项
- 类型:该列数据的数据类型,支持文本、超链接、图片类型的数据列
- 跳转窗口:超链接跳转窗口的形式,支持“新建窗口打开”、“当前窗口打开”、“父窗口打开"、“TOP 窗口打开”等方式
- 图片重复:图片类型数据的重复效果
- 前缀:支持为该列数据项添加前缀
- 后缀:支持为该列数据项添加后缀
- 列宽:支持为该列数据项设置列表宽度,数值为0时将自适应列表宽度
- 排序:该列数据是否进行排序,排序的方式包括升序、降序
- 最大行数:数据列的最大显示行数,数值为-1时将显示全部数据
- 阈值:支持为该列数据设置一个或多个阈值区间,阈值展示风格为单元格展示或文字展示
- 样式:文本列表的样式设置
- 表头:是否显示该列数据项的表头,支持设置表头高度(数值为0时高度自适应)、背景颜色和字体颜色
- 排序箭头:如果您开启了排序,支持为排序箭头设置默认颜色和选中颜色
- 行:支持设置文本列表显示的行数、行高、字体大小、字体颜色、奇偶行的背景颜色等,行高为0时将自适应
- 高亮颜色:文本列表高亮时颜色
- 逐条滚动:是否开启数据逐条滚动效果
- 背景:文本列表组件的背景设置
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 背景图片:组件的背景图片,可直接选择大屏内置的图片素材作为背景或添加自定义的背景图片,自定义背景图片时支持通过输入图片地址和上传图片两种方式添加,您还可以设置图片重复效果
- 尺寸:文本列表组件的尺寸,单位为像素
指标组件
指标组件通过标题和数值的组合,可用于业务指标的统计与展示等。
指标组件的配置项如下:
- 数据类型:指标的数据源,分为静态数据和选择数据:
- 静态数据:在“数据”中输入一个固定的具体数值,即可在大屏中添加一个固定数值的指标
- 选择数据:选择大屏中的已有数据作为数据源
- 标题和单位:
- 显示:是否显示标题和单位
- 标题:指标的标题。静态数据类型指标通过直接输入文字设置,选择数据类型指标支持通过选择数据源中的字段或直接输入文字设置
- 单位:指标的单位,静态数据类型指标通过直接输入文字设置,选择数据类型指标支持通过选择数据源中的字段或直接输入文字设置
- 排列:指标的排列方式,支持水平和垂直
- 字体粗细:字体的粗细设置,包括纤细、标准、加粗等
- 字体颜色:标题与单位的的字体颜色,默认为白色
- 字体大小:字体的大小,单位为像素
- 指标设置:
- 数据:指标数据。静态数据类型指标通过直接输入数值设置,选择数据类型指标通过选择数据源中的字段设置
- 小数位数:可根据数据自动设置小数位数,也可显示固定的小数位数
- 千分符:每千分位的分隔符,默认为“,”
- 数字动画:数值变化的动态效果,开启后可以设置动画的时长
- 文本:指标数值的样式设置,支持设置数值的字体大小、字体颜色和字体间距
- 阈值:支持设置一个或多个指阈值区间,自定义阈值在指标组件中的显示颜色
- 背景:指标数值的背景设置
-
- 背景颜色:数值的背景颜色
- 背景图片:数值的背景图片
- 分隔符背景:是否开启分隔符背景效果
- 边距:设置指标与组件上、下、左、右四个边界间的间距值
- 背景:指标组件的背景设置
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 背景图片:组件的背景图片,可直接选择大屏内置的图片素材作为背景或添加自定义的背景图片,自定义背景图片时支持通过输入图片地址和上传图片两种方式添加,您还可以设置图片重复效果
- 尺寸:指标组件的尺寸,单位为像素
图标组件
图标组件可以在大屏中添加具有指代意义的图形符号,地图大屏中预设了多种常用图标。
图标组件的配置项如下:
- 选择图标:内置数十种常用图标,您可以从中选择符合需求的图标
- 样式:图标组件的样式
- 图标尺寸:图标的尺寸,单位为像素
- 图标颜色:图标的前景色
- 背景:图标组件的背景设置
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 背景图片:组件的背景图片,可直接选择大屏内置的图片素材作为背景或添加自定义的背景图片,自定义背景图片时支持通过输入图片地址和上传图片两种方式添加,您还可以设置图片重复效果
- 尺寸:图标组件的尺寸,单位为像素
图片组件
图片组件可以在大屏中添加任意图片,以增强大屏的可视化效果。
图片组件的配置项如下:
- 图片地址:可选择大屏内置的图片素材或添加自定义图片,自定义图片时支持通过输入图片的 URL地址和上传图片两种方式添加,您还可以设置图片重复效果
- 超链接:为图片添加超链接,点击图片可跳转到链接地址
- 跳转窗口:超链接跳转窗口的形式,支持“新建窗口打开”、“当前窗口打开”、“父窗口打开"、“TOP 窗口打开”等方式
- 背景:图片组件的背景设置
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 尺寸:图片组件的尺寸,单位为像素
视频组件
视频组件可以在大屏中添加 .mp4/.webm/.ogv/.rtmp/.flv/.m3u8 等格式的视频。
视频组件的配置项如下:
- 视频地址:视频的 URL 地址
- 封面地址:视频的封面图片,可选择大屏内置的图片素材作为封面或添加自定义的封面图片,自定义封面图片时支持通过输入图片地址和上传图片两种方式添加
- 播放:视频播放设置
- 弹窗播放:是否以单独的弹窗形式播放视频
- 循环播放:是否在视频播放结束后循环播放
- 自动播放:是否在打开大屏时自动开始播放
- 静音:播放视频时是否静音
- 控制条:是否在播放视频时显示视频下方的控制条
- 尺寸:视频组件的尺寸,单位为像素
视频增强组件
视频增强组件适用于智慧园区管理、安防等行业应用场景。支持缩放漫游操作。
视频增强组件可以在大屏中添加 HTML5 模式的 .mp4/.flv/.m3u8 等格式的视频。
视频增强组件的配置项如下:
- 视频地址:视频的 URL 地址
- 宽高:视频的尺寸,单位为像素
- 循环播放:是否在视频播放结束后循环播放,该设置仅在预览模式生效
- 自动播放:是否在打开大屏时自动开始播放,该设置仅在预览模式生效
- 尺寸:视频增强组件的尺寸,单位为像素
iFrame 组件
iFrame 组件可以在大屏中嵌入第三方网页,将已有的 Web 应用整合至大屏中。
iFrame 组件的配置项如下:
- URL 地址:待嵌入的 iFrame 的 URL 地址
- 尺寸:iFrame 组件的尺寸,单位为像素
幻灯片组件
幻灯片组件可以通过轮播的形式播放图片或文本内容,在有限的空间内灵活、流畅地展示多种信息。幻灯片组件通过与文本列表组件进行交互,可以实现过滤幻灯片组件的显示内容、切换幻灯片。
幻灯片组件的配置如下:
- 数据来源:幻灯片展示内容的数据来源,可选配置
- 选择大屏中的已有数据作为数据来源,幻灯片将分页展示数据内容
- 不选择数据来源,需要在“内容”配置项中配置幻灯片每一页展示的内容
- 内容:幻灯片展示内容的设置
- 类型:幻灯片内容的类型,支持文本、图片类型
- 数据:幻灯片内容所使用的数据,支持自定义和选择字段两种方式配置数据
-
- 文本:文本类型的数据,可以自定义文本内容,也可以在配置了数据来源后,选择数据中的某一字段
- 图片:图片类型的数据,可以自定义图片,支持选择大屏内置的图片素材,或通过输入图片地址和上传图片两种方式添加图片;也可以在配置了数据来源后,选择数据中的某一字段,字段内容需为图片的URL地址。此外,您还可以设置图片重复效果
- 样式:文本或图片内容的样式
-
- 字体大小:文本的字体大小,单位为像素
- 字体颜色:文本的字体颜色,默认为黑色
- 首行缩进:文本的首行缩进值,单位为像素
- 对齐方式:文本的对齐方式,包括居中、左对齐、右对齐等,默认为居中
- 图片宽高:图片的宽度和高度,单位为像素
- 边距:文本或图片与组件上、下、左、右四个边界间的间距值
- 切换:幻灯片页面之间的切换设置
- 效果:幻灯片切换效果设置,包括经典、方块、翻页、旋转效果,可设置切换方向为水平或垂直,还可以设置是否循环切换,即在切换幻灯片末页后会回到幻灯片首页
- 控制:通过鼠标或键盘控制幻灯片的切换操作
-
- 鼠标:通过鼠标拖动幻灯片或点击幻灯片的切换按钮实现幻灯片的切换
- 键盘:通过键盘的方向键控制幻灯片的切换,水平切换的幻灯片采用左右方向键控制,垂直切换的幻灯片采用上下方向键控制
- 按钮:控制幻灯片两侧切换按钮的显示
- 自动播放:根据设置的时间间隔自动切换幻灯片
- 样式:文本或图片内容的样式
- 分页:幻灯片分页显示样式,包括圆点、分式、进度条
- 颜色:组件的背景颜色
- 渐变:是否开启渐变效果,开启后还可选择渐变效果的方向,渐变色与组件的背景颜色相关
- 背景图片:组件的背景图片,可直接选择大屏内置的图片素材作为背景或添加自定义的背景图片,自定义背景图片时支持通过输入图片地址和上传图片两种方式添加,您还可以设置图片重复效果
- 尺寸:幻灯片组件的尺寸