模板学堂丨妙用Tab组件制作多屏仪表板并实现自动轮播

DataEase开源数据可视化分析平台于2022年6月正式发布模板市场(https://dataease.io/templates/)。模板市场旨在为DataEase用户提供专业、美观、拿来即用的仪表板模板,方便用户根据自身的业务需求和使用场景选择对应的仪表板模板,并在优质模板的基础上轻松制作自己的仪表板。

2023年2月上新模板

DataEase模板市场定期进行模板上新。2023年2月共上新5个模板,涉及能源、测试、采购、消费等主题,欢迎大家在DataEase模板市场下载使用。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

模板技巧

本月为大家推荐的模板技巧是如何使用DataEase的选项卡组件(即Tab组件)实现多个大屏轮播的效果。

不少用户在实际使用DataEase时都会产生多个大屏同时使用并展现的需求,而给每个大屏配置一个单独的显示设备并不是一个现实的方法,那么就需要在一个显示设备上实现多个大屏轮播的效果。在DataEase开源数据可视化分析平台上,只需要简单的一个选项卡组件(即Tab组件),就可以轻松满足用户在大屏展示时多个仪表板并按照固定时间轮播的需求。

本次模板技巧涉及到的功能背景如下:

■ DataEase选项卡组件(即Tab组件)支持放入多个其他类型组件,可以在Tab组件中创作多个不同的仪表板;

■ 通过Tab组件的轮播功能可实现不同Tab页的轮播效果。

方法介绍

■ 方法一:将选项卡组件大小设置为与仪表板大小相同,将选项卡作为仪表板的画布来使用,在每个选项页下完成独立完整的仪表板的制作;

■ 方法二:将选项卡组件大小设置为与仪表板大小相同,再将网页组件放入到选项卡组件中,同样将大小设置为与仪表板页面相同大小,网页组件中配置对应已做好的仪表板公共链接。

操作演示

一、方法一操作过程

1.将选项卡组件拖入到仪表板中;
在这里插入图片描述

2.将选项卡组件的大小设置为与仪表板同样大小;
在这里插入图片描述

3.在每个Tab标签页下的空间中放入需要的各类视图和组件,制作完整的仪表板;
在这里插入图片描述

4.开启轮播,并配置轮播间隔时间;
在这里插入图片描述

5.预览仪表板,查看自动轮播效果。
在这里插入图片描述

二、方法二操作过程

方法二需要满足以下两个条件才可实现:

■ 各个需要轮播的仪表板均单独存在,且已制作完成;

■ 各个仪表板在安全性控制上支持创建公共链接,即可以通过创建的公共链接进行无密码访问。

1.将选项卡组件拖入到仪表板中;
在这里插入图片描述

2.将选项卡组件的大小设置为与仪表板同样大小;
在这里插入图片描述

3.在每个选项卡组件中放入一个网页组件,也将其大小调整为屏幕大小;
在这里插入图片描述

4.分别对想要统一轮播的仪表板创建公共链接,并配置在网页组件中;
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

5.开启轮播并配置轮播间隔时间;
在这里插入图片描述

6.预览仪表板,查看自动轮播效果。
在这里插入图片描述

总结

DataEase开源数据可视化分析工具中很多功能用法是具有多样性的。以选项卡组件轮播功能为例,除了上述用法外,您还可以通过在不同的Tab页下放置不同的图片实现图片轮播等效果。此外,关于实现大屏的轮播也有一些外部辅助的方式,例如通过Chrome浏览器的Revolver-Tabs插件来实现浏览器不同标签页的轮播效果。

DataEase致力于和大家一起探索新的功能和效果实现,通过持续的迭代做出更好的产品,满足个人和企业用户更为多元化的场景需求,努力实现“人人可用”的目标。

相关推荐

支持千问安全围栏模型,1Panel AI网关v1.6.0版本发布

新增上游账号多API Key、同一请求模型多映射、OpenAI兼容图像编辑接口、实时用户活动卡片与版本更新通知。

FIT2CLOUD飞致云的博客 225

飞致云开源社区月度动态报告(2026年10月)

为数智经济时代创造好软件。

FIT2CLOUD飞致云的博客 109

新增语音API与模型管理功能,1Panel AI网关v1.5.0版本发布

上游账号管理支持多种协议类型与错误历史查看。

FIT2CLOUD飞致云的博客 446

持续提升系统安全性与用户体验,JumpServer堡垒机v4.10.20 LTS版本发布

欢迎广大用户升级至新版本。

FIT2CLOUD飞致云的博客 245

安全漏洞和已知问题修复,MaxKB开源企业级智能体平台v2.10.8 LTS版本发布

欢迎升级至新版本MaxKB。

FIT2CLOUD飞致云的博客 188

支持SMB远程文件数据源,查询组件支持多条件搜索,DataEase开源BI工具v3.2.0版本发布

透视表条件样式支持指定范围,汇总表支持图片链接渲染与放大预览。

FIT2CLOUD飞致云的博客 80

离线安装方式上线,支持Token Plan,1Panel AI网关v1.4.0版本发布

进一步提升AI网关部署的灵活性与日常运维体验。

FIT2CLOUD飞致云的博客 185

KoKo、Tinker组件重构,会话录像支持批量下载,JumpServer开源堡垒机v5.1.0版本发布

命令过滤规则支持AI辅助起草

FIT2CLOUD飞致云的博客 180

修复多个安全漏洞,MaxKB开源企业级智能体平台v2.10.7 LTS版本发布

欢迎升级至新版本MaxKB。

FIT2CLOUD飞致云的博客 172

学习笔记丨MaxKB PPT/PDF文档整页转图工作流知识库方案

解决复杂图文文档知识入库难题。

FIT2CLOUD飞致云的博客 294

飞致云开源社区月度动态报告(2026年9月)

为数智经济时代创造好软件。

FIT2CLOUD飞致云的博客 241

1Panel AI网关智能路由新增支持Jev模式

面向多个自定义业务目标进行语义决策。

FIT2CLOUD飞致云的博客 295

电子表格支持嵌入集成,支持GaussDB数据源与StarRocks计算引擎,DataEase开源BI工具v3.1.0版本发布

新增箱线图图表类型,修复7项安全漏洞。

FIT2CLOUD飞致云的博客 447

操作教程|通过1Panel应用商店快速安装Laya

Laye开源模型已上架至1Panel应用商店。

FIT2CLOUD飞致云的博客 209

修复安全漏洞,支持箱线图与汇总表合并单元格,DataEase开源BI工具v2.10.27 LTS版本发布

公共链接支持独立访客权限控制,数据填报与定时报告功能增强。

FIT2CLOUD飞致云的博客 382

强化安全性,Text-to-SQL智能选表升级,SQLBot开源智能问数系统v1.10.2版本发布

强化账号安全初始化机制,新增泰语支持。

FIT2CLOUD飞致云的博客 435

实战丨飞致云面向自身销售场景打造专属CRM Skills

自然语言驱动CRM智能查询、创建、更新、转化、链路追踪与漏斗分析。

FIT2CLOUD飞致云的博客 235

跨越新高度:JumpServer V5 来了!

统一工作台,拥抱AI新时代!

FIT2CLOUD飞致云的博客 112

测评|双卡RTX Pro 5000 Blackwell+Qwen3.8-Flash-Next:WorkBuddy办公场景实测

业务场景一手测试数据解读。

FIT2CLOUD飞致云的博客 281

支持多种登录认证方式、支持MFA与重排模型,1Panel AI网关功能上新

新增支持为上游账号配置代理和更多实用功能。

FIT2CLOUD飞致云的博客 123

案例研究|中国土木构建“财小问”智能体,提升财务管理效率

MaxKB助力财务部门从重复劳动迈向智能决策。

FIT2CLOUD飞致云的博客 96

联合方案丨MaxKB+DataEase实现智能跨库问数

通过自然语言提问,在权限范围内获取一站式的可视化数据以及数据洞察结论。

FIT2CLOUD飞致云的博客 219

GPU监控支持华为昇腾设备,防火墙管理焕新,虚拟机管理下放至专业版,1Panel v2.3.0版本发布

持续完善1Panel在AI模型部署与硬件适配方面的能力。

FIT2CLOUD飞致云的博客 253

免费AI网关测评:LiteLLM、New API和1Panel AI网关

为企业运维团队、AI业务团队提供选型参考。

FIT2CLOUD飞致云的博客 287

告别积分焦虑!WorkBuddy+Qwen3.8-Flash-Next本地部署,实现AI办公自由

把算力自由握在自己手里。

FIT2CLOUD飞致云的博客 417

工作流支持默认模型设置,MaxKB开源企业级智能体平台v2.10.6 LTS版本发布

腾讯混元、腾讯云模型供应商合并为新“腾讯云”供应商。

FIT2CLOUD飞致云的博客 344

1Panel AI网关现已开放,10人及以下团队免费使用

助力小团队低成本落地AI规模化应用。

FIT2CLOUD飞致云的博客 379

算力与带宽的博弈:双GB10算力节点部署DeepSeek-V4-Flash实测

用对场景,才算物尽其用。

FIT2CLOUD飞致云的博客 366

飞致云开源社区月度动态报告(2026年8月)

为数智经济时代创造好软件。

FIT2CLOUD飞致云的博客 195

服务端AI智能体CORDYS AI上线,Cordys CRM发布v1.9.0版本

跟进记录与跟进计划新增评论功能。

FIT2CLOUD飞致云的博客 225
上一篇: 九年时间,倾情投入,JumpServer开源堡垒机v3.0正式发布
下一篇: 案例研究|依能科技基于JumpServer构建运维安全审计平台
FIT2CLOUD飞致云
FIT2CLOUD飞致云 企业官方账号 企业官方账号
博客等级 码龄7年 3193粉丝 738原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值