FineVis可视化大屏白皮书

©帆软软件有限公司1/61 中国报表软件领导品牌FVS大屏白皮书V1.0 目录 1.可视化大屏介绍5 1.1大屏的定义5 1.2大屏的使用场景5 1.3产品功能结构6 2.FVS大屏编辑器7 2.1大屏画布7 2.2多分页设计9 2.2.1创建多分页10 2.2.2分页间动画10 2.2.2.1平滑过渡11 2.2.2.2组件进出动画11 2.3可视化图表12 2.3.1基础图表12 2.3.2数据地图12 2.3.2.1平面地图13 2.3.2.2场景切换地图13 2.3.2.3轮播三维组合地图13 2.3.2.4轮播GIS点地图14 2.3.3酷炫扩展图表14 2.3.4图表样式编辑15 2.3.4.1数据配置15 2.3.4.2样式属性15 2.43D可视化16 2.4.1自定义模型组件16 2.4.1.1场景环境16 1）环境17 2）相机18 3）图像18 2.4.1.2模型配置19 1）层级数据预处理19 2）模型风格预处理19 3）属性调整20 2.4.1.3数据图层20 1）数据标签21 2）数据预警21 2.4.1.4视角设置22 1）单个视角22 2）多视角钻取22 2.4.1.5动画设置23 2.4.2三维城市组件23 2.4.2.1创建场景23 2.4.2.2调整场景24 2.4.2.3数据图层24 2.4.2.4自定义geojson25 2.4.3Unity集成组件25 2.5文本类组件26 2.5.1标题组件26 2.5.2富文本组件26 2.5.3表格组件27 2.6交互事件27 2.6.1参数设置28 2.6.2参数控件28 2.6.3点击事件28 2.6.3.1组件联动28 2.6.3.2弹出框29 2.6.3.3网页链接29 2.6.3.4分页跳转30 2.6.3.5JavaScript脚本30 2.6.3.6三维组件动画31 2.6.4tab轮播31 2.6.4.1轮播器组件31 2.6.4.2轮播切换事件32 2.7数据监控33 2.7.1组件监控刷新33 2.7.2全局刷新33 2.7.3实时监控视频33 3.大屏资产管理35 3.1图片资产35 3.1.1内置图片素材35 3.1.2自定义上传图片36 3.1.3边框背景图片36 3.2视频资产37 3.2.1内置视频37 3.2.2自定义视频37 3.3三维模型资产38 3.3.1自定义模型38 3.3.2场景文件38 3.4组件资产39 3.4.1组件样式39 1）基础属性39 2）组件背景图样式40 3）更多组件样式40 3.4.2组件资源复用41 3.4.3组件商城41 3.5模板资源42 3.5.1模板资源复用42 3.5.2模板商城42 4.多数据源接入43 4.1支持的数据源类型43 4.2支持的数据库类型43 5.模板的发布与查看44 5.1多屏自适应44 5.1.1自动自适应44 5.1.2高度铺满自适应44 5.1.3宽度铺满自适应45 5.1.4双向铺满自适应45 5.1.5无自适应46 5.2播放控制46 5.3离屏控制47 5.3.1离屏控制投屏比例47 5.3.2离屏控制交互事件47 5.4模板发布49 5.5系统集成49 5.4.1web页面集成49 5.4.2单点登录49 6.平台管理50 6.1目录管理50 6.2用户管理51 1）用户添加51 2）机构部门管理51 3）角色管理51 4）用户认证51 6.3权限管理52 6.4安全管理52 1）安全防护52 2）访问控制53 3）SQL防注入53 6.5智能运维54 7.产品环境支持55 7.1服务器端环境55 7.1.1软件环境55 7.1.2硬件环境55 7.2客户端环境56 7.2.1复杂三维场景57 7.2.2普通三维场景58 7.2.3无三维场景59 8.联系我们60 1.可视化大屏介绍 1.1大屏的定义 大屏是以大屏幕为载体进行可视化展示的统称。可视化通常被理解为一个制作图表、生成图形图像的简单过程，而更深刻的认识则是，可视化是认知的过程，即形成某个物体的感知图像，强化认知理解，辅助大脑处理信息。 因此，大屏的目标是通过大屏幕的可视化，帮助用户洞悉业务数据，在脑海中高效处理信息、快速做出应答。 在帆软的产品体系中，FineReport通过快速制作报表提高数据的生产力，FVS大屏作为FineReport的特殊模块，致力于通过不限于PC端的更大的屏幕，让数据可视化创造更大的客户价值。 大屏具有以下优势： 多人共享：大屏的物理特征决定了可以多人共享、共用一块大屏幕进行数据决策 数据透明：以大屏幕展示数据，利于保障数据的公开、决策的公正和结果的透明 沉浸式体验：大屏可视化的效果比普通屏幕展示来得更震撼，结合3D效果更具体验感 1.2大屏的使用场景 大屏的应用场景常见于展览中心、监控指挥室、大会议室和车间看板，不同场景的大屏内容侧重点不 同。 展览中心：以对外参观、展示为主要目的，需要兼具精致的视觉效果和逻辑完整的大屏故事线 监控指挥中心：以实时监控、及时预警、集中指挥为主要目的，通过图表、指标卡、三维模型等可视化元素让监控数据的展现更生动 会议室大屏：以支撑会议讨论、决策分析为主要目的，数据较为明细，需要钻取、联动、筛选等实用的大屏交互功能达成可视化分析的价值 车间看板大屏：以实时监测生产车间的运行情况为主要目的，与三维模型结合后达到虚实相映的效果，更直观地反馈车间设备的生产运行情况 1.3产品功能结构 FVS大屏沿袭了FineReport强大的多数据源集成和坚实的平台管理等基础能力，进一步专研专业的大屏编辑器，优化大屏资产管理、发布、查看等模块，打造强大易用的大屏产品化工具。 2.FVS大屏编辑器 FVS大屏编辑模式是一种零代码、低代码的大屏开发模式，FVS基于FineReport的C/S端设计器，有以下基础特征及优势： 所见即所得画布：FVS大屏编辑器以所见即所得的画布为基础，内置各式各样的可视化组件，拖拽出组件即可进行布局编排，再点选式配置组件的数据和交互事件，即可完成一张可视化大屏，兼具了C/S端开发的稳定和B/S端开发的效率 多分页设计模式：FVS特有的多分页设计模式，帮助用户打造具有“故事性”的大屏 支持远程设计：支持远程设计，在本地即可连接远程服务器进行大屏模板的设计和发布，远程设计支持多用户登录和权限控制，可以设定不同用户远程设计时访问不同的文件夹、模板的权限；多部门（用户）协同开发系统的时候，只能对自己权限范围内的模板进行维护，互不干涉，不再需要超级管理员进行汇总协调，提升协同开发的效率 支持多工作目录：帆软大屏设计器支持多工作目录，用户可随时在多个大屏工程项目上切换工作，进行不同的设计 支持国际化：FVS大屏编辑器进行了国际化适配，支持多种语言，涵盖简体中文、繁体中文、英文、日文、韩文等 一键快速更新：支持设计器在线更新升级，并提供更新日志查看，免去重新安装的麻烦 2.1大屏画布 1 菜单栏 文件：用户可以创建、保存、导出FVS模板，或切换远程工作目录编辑文件，便于进行模板的管理、传递和协同开发 模板：对单个模板，可设置模板参数、模板主题、JS事件等全局性的属性 服务器：对整个报表服务器，可设置全局参数，进入报表管理平台和插件管理 帮助：支持在线更新设计器版本，支持开启AlphaFine功能查找相关资料 社区：可以进入帆软社区、帮助文档、视频课程、模板商城或BUG反馈、技术支持工单中心，辅助用户更好地使用产品 2 文件区 可以打开或切换当前FineReport工程下的所有模板。 3 数据源 可以连接上模板所需的数据库，创建数据集，从数据集中拖拽出所需字段，创建大屏指标和图表。对数据源的支持可参见“4.多数据源接入”章节。 4 标题区 显示当前FVS大屏模板的名称，可以对模板进行重命名。 5 操作栏 用户可以进行动作的撤销、还原操作，进行组件的组合、拆分、删除操作，以及组件位置的对齐、调整层级操作，让模板编辑更快捷顺畅。 6 保存预览区 用户制作完FVS大屏模板后，可点击保存、预览或关闭模板，预览模板时可以在浏览器查看模板 的效果。 7 组件图层区 展开组件图层区后，用户可以在图层区查看当前分页下的所有组件，可对组件进行重命名、删除、隐藏、锁定等操作，并可以拖拽调整组件层级的次序。 8 组件列表栏 支持3D、图表、文字、媒体、容器、控件6大类可视化组件，展开后可拖出超过60种图表类型。详情可参见“2.3可视化图表”、“2.43D可视化”、“2.5文本类组件”三个小节。 9 画布主体区 画布是大屏模板的主体部分，可以进行所见即所得的模板设计，新增组件、调整组件，可以在不需要保存预览的情况下直接看到效果；对于不需要显示的备用组件或中间组件，可以拖出画布外。 10 画布分页区 一个FVS大屏模板中可以包含多个分页，通过分页之间的切换可以实现大屏场景或3D模型视角的切换，可以满足幻灯片汇报、故事性大屏路演等场景。详情可参见“2.2多分页设计”。 11 画布属性区 用户创建画布后，还可以调整画布的大小，即模板的分辨率；为了设计方便，可以调整模板画布的缩放比例为自动适应的大小或任意百分比；也可以调整模板的自适应属性，详情参见“5.1多屏自适应”小节。 12 配置栏 当选中分页时，用户可以对配置当前分页设置名称、背景、过渡效果等属性；当选中分页中的组件时，可以配置选中组件的内容、交互、动画、样式等属性。 13 快捷键 为了更好地支持快速开发大屏，FVS支持复制、粘贴、保存、撤销等快捷键。 2.2多分页设计 在FVS中，大屏不是一个静止的画面，而是多个分页组合成的一套可视化资产。每个分页拥有各自的组件资产，在用户自由切换分页时，组件发生各种各样的数据、位置、形态变化，使FVS模板兼具幻灯片的演示效果和驾驶舱大屏的可视化分析能力。 2.2.1创建多分页 当用户的大屏模板有多个不同主题的内容需要切换展示时，可以应用FVS多分页设计的功能。FVS支持新建空白页面或复制粘贴已有的页面创建多个分页，也可以对已有的页面重命名或删除。在预览模板时，通过点击切换按钮，或键盘的“←”、“→”方向键即可切换不同的分页，详细的模板播放设置参见“5.2播放控制”小节。 2.2.2分页间动画 在切换不同的分页时，灵活应用组件动效可以增强模板的可读性和趣味性。FVS通过两种方式实现分页间的动效： 2.2.2.1平滑过渡 当页面间存在较多相同的元素时，可以开启平滑过渡，相同名称的组件内容不需要重复载入，可提升图表、图表、三维模型资源较多较大的模板切页时的性能体验。 2.2.2.2组件进出动画 分页间动画可以让有时序关系或逻辑次序的组件依次进出，也可以用于修饰图表组件在切页时的数据加载效果。 用户可以开启组件的进出场动画，让组件伴随页面的切换淡入、淡出或从四周进入、退出，并可以进一步设置动效的时机和时长，使得组件的进出有次序，带来更大的视觉冲击力。 2.3可视化图表 FVS内置60+图表类型，且均为自主研发设计的成果，可以避免使用第三方插件带来的知识产权、服务、文档等不便。基于内置图表样式，用户可以进行进一步的数据关联和自定义样式编辑。 2.3.1基础图表 基础分析图表指常用于辅助数据分析、呈现分析结果的图表，包括但不限于柱形图，折线图，饼图，雷达图，散点图、圆环图，条形图，地图、堆积图、面积图、组合图、气泡图、地图、GIS地图、仪表盘、矩形树图、甘特图、框架图等超过50种基础分析图表。 2.3.2数据地图 地图是大屏中最引人瞩目的可视化元素，常常位于大屏的中心，FVS大屏支持区域地图、流向地图等平面地图和不同样式的三维地图。 2.3.2.1平面地图 平面地图功能丰富，支持钻取地图、热力地图、流向地图、气泡地图、自定义地图等展示类型，内置最新的世界地图和精确到县区级别的中国地图，并拥有合规审图号，用户不用担心地