基于VUE的机房全景可视化方法与流程

专利2026-08-12  14


本发明涉及机房全景可视化,尤其是涉及基于vue的机房全景可视化方法。


背景技术:

1、随着运维技术的不断发展,3d可视化技术已成为时下主流的数据中心机房的管理系统之一。它以人们最直观的方式呈现,提高信息交互的效率,降低信息损耗和时间损耗,让数据中心机房运维管理人员大幅度提升操控效率,加快响应时间,缩短处理时间。

2、电网公司以投资建设运营电网为核心业务,承担着保障安全、经济、清洁、可持续电力供应的基本使命。其中,信息通信调度有相当重要的作用。在各地都存在着大量的电力设备,这些设备的运维和管理都是通过信息通信调度人员在调控大厅远程实现。

3、目前有许多可视化大屏项目用于建立智慧机房监测模块,进行机房状态检测、监控和可视化。这些软件可以实时观看机房动态信息并展示在网页上面,但可能不太强调页面美观和交互性,如:

4、交互性受限:许多机房监测模块的交互性可能有限,用户可能无法进行实时的场景交互、探索和操作。这在模拟操作和培训等方面可能受到限制。

5、复杂度和学习曲线:使用一些电力系统仿真软件可能需要一定的技术背景和学习曲线。这可能使得一般用户难以轻松使用和理解。

6、实时性不足:一些机房监测模块可能在处理实时数据和事件方面存在困难,限制了其在实时监控和决策方面的应用。

7、成本:商业智慧机房监控系统可能需要较高的许可费用,对于一些小型组织或项目来说可能不太适用。

8、数据共享和协作:在一些现有技术中,多人协作和数据共享可能有限,限制了团队合作和协同工作。


技术实现思路

1、本发明提供基于vue的机房全景可视化方法,在一定程度上克服部分现有技术缺陷,并提供更高水平的可视化、交互性和实时性。

2、本说明书公开了基于vue的机房全景可视化方法,包括:

3、s1.基于机房动力环境设备和网络设备的数据处理和可视化库,提取出所需展示的关键信息;

4、s2.基于所述关键信息,使用vue框架进行数据处理和提取;

5、s3.基于s2中处理好的数据,根据u i设计图配置页面dom节点,以不同类别id放置多组图表组件,通过不同图表展示同组数据;

6、s4.将s2中处理好的数据的格式,转换为vue可识别的数据格式;

7、s5.获取机房平面图、机房监控、温湿度传感器、ups负载的位置,并制作伪3d平面图放置于页面dom节点,根据vue位置定位特性,设置不同dom子节点,设置点击事件,加强交互效果,根据不同事件,展示不同效果;

8、s6.通过数据集成将来自不同数据源的数据整合成一个统一的视图或数据集;

9、s7.通过建立与实际数据源的连接,实时获取机房的实时数据,并通过vue的双向绑定原理以实现实时的动态展示。

10、本说明书的一些实施例中,所述关键信息包括机房监控数据、温湿度传感器的数据,以及ups负载的位置、状态及温度数据,以及设备的类型、状态、负载属性信息。

11、本说明书的一些实施例中,s2中使用vue框架进行数据处理和提取的过程如下:

12、s21.通过javascr i pt内置的方法和函数进行数据处理和提取;

13、s22.通过编写合适的正则表达式,进行数据提取、替换、过滤;

14、s23.vue框架中的第三方库和工具进行数据处理和提取;

15、s24.通过模板引擎进行数据处理和提取。

16、本说明书的一些实施例中,s21中使用字符串的sp l it()、s l i ce()、substri ng()来截取和处理字符串数据。

17、本说明书的一些实施例中,s21中使用数组的map()、f i l ter()、reduce()来处理和提取数组数据。

18、本说明书的一些实施例中,s21中使用对象的属性访问和操作方法来处理和提取对象数据。

19、本说明书的一些实施例中,s23中,使用lodash来处理数组、对象、字符串数据。

20、本说明书的一些实施例中,s23中,使用moment.js来解析、格式化和操作日期时间数据。

21、本说明书的一些实施例中,s23中,使用axi os来获取和处理服务器返回的数据。

22、综上所述,本说明书实施例至少可以实现以下有益效果:

23、实时数据关联:基于vue的响应式数据绑定原理可以与实时数据源相结合,将实时机房信息数据关联到系统模块中。这样,用户可以随时查看机房的实际信息,并了解设备的实时运行情况。

24、交互性和操作:vue许用户进行实时的页面交互、探索和操作。用户可以通过虚拟现实设备、鼠标和键盘等进行虚拟场景的操作,模拟不同情况下的操作效果。

25、实时性和响应性:vue的实时渲染能力可以在机房信息变化时即时响应,并展示最新机房数据。这在实时监控、紧急事件响应和决策方面非常有用。

26、多人协作和远程工作:vue支持多人协作和远程工作,团队成员可以在不同地点同时观测机房信息的变化和分析。



技术特征:

1.基于vue的机房全景可视化方法,其特征在于,包括:

2.根据权利要求1所述的基于vue的机房全景可视化方法,其特征在于,所述关键信息包括机房监控数据、温湿度传感器的数据,以及ups负载的位置、状态及温度数据,以及设备的类型、状态、负载属性信息。

3.根据权利要求1所述的基于vue的机房全景可视化方法,其特征在于,s2中使用vue框架进行数据处理和提取的过程如下:

4.根据权利要求3所述的基于vue的机房全景可视化方法,其特征在于,s21中使用字符串的split()、slice()、substring()来截取和处理字符串数据。

5.根据权利要求3所述的基于vue的机房全景可视化方法,其特征在于,s21中使用数组的map()、filter()、reduce()来处理和提取数组数据。

6.根据权利要求3所述的基于vue的机房全景可视化方法,其特征在于,s21中使用对象的属性访问和操作方法来处理和提取对象数据。

7.根据权利要求3所述的基于vue的机房全景可视化方法,其特征在于,s23中,使用lodash来处理数组、对象、字符串数据。

8.根据权利要求3所述的基于vue的机房全景可视化方法,其特征在于,s23中,使用moment.js来解析、格式化和操作日期时间数据。

9.根据权利要求3所述的基于vue的机房全景可视化方法,其特征在于,s23中,使用axios来获取和处理服务器返回的数据。


技术总结
本发明提供了一种基于VUE的机房全景可视化方法,包括:提取出所需展示的关键信息;使用VUE框架进行数据处理和提取;配置页面DOM节点;转换为VUE可识别的数据格式;制作伪3D平面图放置于页面DOM节点;通过数据集成将来自不同数据源的数据整合成一个统一的视图或数据集;通过建立与实际数据源的连接,实时获取机房的实时数据,并通过VUE的双向绑定原理以实现实时的动态展示。本发明在一定程度上克服部分现有技术缺陷,并提供更高水平的可视化、交互性和实时性。

技术研发人员:张大伟,李斌,赵静,李明生,王彦沣,熊志杰,杨小磊
受保护的技术使用者:四川蓉电科技发展有限公司
技术研发日:
技术公布日:2024/6/26
转载请注明原文地址:https://doc.8miu.com/read-1832788.html

最新回复(0)