JVS-BI数字大屏设计器:一站式解决方案

2023-10-31 10:44

本文主要是介绍JVS-BI数字大屏设计器:一站式解决方案,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

数字大屏介绍

数字大屏是当下数据展示、业务监控、指挥调度常见的业务表达形态,常有可视化的图表、效果装饰、事件操作等技术组成酷炫的效果展示。

配置入口

进入JVS-BI(bi.bctools.cn),进入大屏页面,如下图所示

①:大屏配置、展示页面

②:点击“+”号,系统弹出新建菜单

③:点击新建目录时,可以创建左侧的菜单目录

④:点击新建大屏,系统需要选择在哪个目录下新建大屏页面

⑤:点击设置按钮,进入大屏的素材管理页面

⑥:大屏的操作菜单,其中分目录与具体大屏页面

⑦:大屏的预览页面,点击左侧目录下的具体页面,可以在这里预览大屏

素材管理

素材是大屏展示中会常用的内容,JVS提供了自定义素材的能力,如下图所示:

系统提供素材的目录管理、素材的自定义上传,素材的预览、重命名、删除等操作。

大屏结果预览

在左侧目录上,点击具体页面,系统将在右侧展示预览的效果

基础说明

大屏设计器的进入入口,如下图所示,具备设计权限的工具,在对应的大屏展示页面菜单上,鼠标悬浮“...”按钮时,系统自动弹出设计菜单,点击页面设计,即可进入大屏设计器

大屏设计器包括页面设置、大屏设计、页面权限三个部分,如下图所示,页面设置包括页面的基本信息和备注描述,这里的大屏名称和左上角的页面名称是实时同步的。

页面布局

大屏设计界面为整个配置器的核心页面,如下图所示,

①:大屏的名称,可以点击“笔”图标,进入名称修改状态,完成修改后通过回车即可保存

②:大屏设计过程的配置按钮,包括预览、发布为模板、保存,这里的发布模板是将配置的大屏结果发布到模板中心,其他的用户可以通过这个模板快速创建展示页面;保存按钮是对当前配置内容进行保存

③:资源面板,包括画布-图层-组件的配置管理,每一个组件的引入会作为一个单独图层进行展示,画布是由多个组件(图层)合并构建的,一个大屏的设计的结果可以是由多个画布组成。

④:配置面板,选中画布中的内容组件,这里展示每个组件对应的配置内容,如果没有选中任何组件,那么这里展示的画布的基础配置内容

⑤:配置面板折叠按钮,通过这个按钮可以折 配置面板

⑥:页面切换,通过点击不同的页面,可实现页面的切换为当前编辑页,这里的母版 是在所有页面都会生效的内容,且在其他页面不能编辑。

⑦:页面控制操作,包括页面的移动、页面的前进后退、页面的放大缩小。

资源面板

资源面板如下图所示,资源版本核心包括组件、图层和画布

资源面板的开启与隐藏,可以通过下图中的三种方式开启资源面板的配置,

当点击上图中的②时,如果点击组件,则进入组件配置页面,如果点击的画布,则进入画布页面。

配置面板

配置面板主要是对选中对象的配置窗口,如果选中的是图表组件,系统将弹出对图表相关的配置内容,下图所示,

如果选中的是装饰图片,右侧将切换为图片相关的配置设置,如果是点击空白位置,右侧展示的是大屏基础的设置内容,例如背景样式等内容。

底部状态栏

底部状态栏包括画布编辑的切换,通过点击对应画布,将对应的页面作为当前编辑页,选择对应的画布时,左侧将相应的展示当前画布的图层(组件),画布中的母版内容会对所有页面有影响

通过放大、缩小按钮会对画布的内部展示的大小进行缩放控制,可以通过在画布上点击右键,对画布进行拖动位置调整。

在线demo:http://bi.bctools.cn/

gitee地址:https://gitee.com/software-minister/jvs-bi

这篇关于JVS-BI数字大屏设计器:一站式解决方案的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/314790

相关文章

Nginx启动失败:端口80被占用问题的解决方案

《Nginx启动失败:端口80被占用问题的解决方案》在Linux服务器上部署Nginx时,可能会遇到Nginx启动失败的情况,尤其是错误提示bind()to0.0.0.0:80failed,这种问题通... 目录引言问题描述问题分析解决方案1. 检查占用端口 80 的进程使用 netstat 命令使用 ss

部署Vue项目到服务器后404错误的原因及解决方案

《部署Vue项目到服务器后404错误的原因及解决方案》文章介绍了Vue项目部署步骤以及404错误的解决方案,部署步骤包括构建项目、上传文件、配置Web服务器、重启Nginx和访问域名,404错误通常是... 目录一、vue项目部署步骤二、404错误原因及解决方案错误场景原因分析解决方案一、Vue项目部署步骤

在MySQL执行UPDATE语句时遇到的错误1175的解决方案

《在MySQL执行UPDATE语句时遇到的错误1175的解决方案》MySQL安全更新模式(SafeUpdateMode)限制了UPDATE和DELETE操作,要求使用WHERE子句时必须基于主键或索引... mysql 中遇到的 Error Code: 1175 是由于启用了 安全更新模式(Safe Upd

Python安装时常见报错以及解决方案

《Python安装时常见报错以及解决方案》:本文主要介绍在安装Python、配置环境变量、使用pip以及运行Python脚本时常见的错误及其解决方案,文中介绍的非常详细,需要的朋友可以参考下... 目录一、安装 python 时常见报错及解决方案(一)安装包下载失败(二)权限不足二、配置环境变量时常见报错及

Java数字转换工具类NumberUtil的使用

《Java数字转换工具类NumberUtil的使用》NumberUtil是一个功能强大的Java工具类,用于处理数字的各种操作,包括数值运算、格式化、随机数生成和数值判断,下面就来介绍一下Number... 目录一、NumberUtil类概述二、主要功能介绍1. 数值运算2. 格式化3. 数值判断4. 随机

Java下载文件中文文件名乱码的解决方案(文件名包含很多%)

《Java下载文件中文文件名乱码的解决方案(文件名包含很多%)》Java下载文件时,文件名中文乱码问题通常是由于编码不正确导致的,使用`URLEncoder.encode(filepath,UTF-8... 目录Java下载文件中文文件名乱码问题一般情况下,大家都是这样为了解决这个问题最终解决总结Java下

Idea实现接口的方法上无法添加@Override注解的解决方案

《Idea实现接口的方法上无法添加@Override注解的解决方案》文章介绍了在IDEA中实现接口方法时无法添加@Override注解的问题及其解决方法,主要步骤包括更改项目结构中的Languagel... 目录Idea实现接China编程口的方法上无法添加@javascriptOverride注解错误原因解决方

MYSQL事务死锁问题排查及解决方案

《MYSQL事务死锁问题排查及解决方案》:本文主要介绍Java服务报错日志的情况,并通过一系列排查和优化措施,最终发现并解决了服务假死的问题,文中通过代码介绍的非常详细,需要的朋友可以参考下... 目录问题现象推测 1 - 客户端无错误重试配置推测 2 - 客户端超时时间过短推测 3 - mysql 版本问

Android kotlin语言实现删除文件的解决方案

《Androidkotlin语言实现删除文件的解决方案》:本文主要介绍Androidkotlin语言实现删除文件的解决方案,在项目开发过程中,尤其是需要跨平台协作的项目,那么删除用户指定的文件的... 目录一、前言二、适用环境三、模板内容1.权限申请2.Activity中的模板一、前言在项目开发过程中,尤

Linux内存泄露的原因排查和解决方案(内存管理方法)

《Linux内存泄露的原因排查和解决方案(内存管理方法)》文章主要介绍了运维团队在Linux处理LB服务内存暴涨、内存报警问题的过程,从发现问题、排查原因到制定解决方案,并从中学习了Linux内存管理... 目录一、问题二、排查过程三、解决方案四、内存管理方法1)linux内存寻址2)Linux分页机制3)