[发明专利]基于浏览器的数据可视化方法、装置及可读存储介质

说明书

本发明公开了一种基于浏览器的数据可视化方法、装置及可读存储介质，所述可视化方法包括：创建超文本标记语言文档，并在所述超文本标记语言文档中引入js文件；在所述js文件中引入基于WebGL的浏览器3D引擎；创建Atom类，在所述Atom类的构造函数中实例化所述浏览器3D引擎的绘制场景数据、字体数据以及动画效果数据；设置初始函数，在所述初始函数中初始化所述浏览器3D引擎，以进行可视化绘制。本发明能够在浏览器中实现三维展示的效果，相比二维展示更加生动形象，能够更加真实和清晰的反应实际情况。

技术领域

本发明涉及计算机技术领域，特别是涉及一种基于浏览器的数据可视化方法、装置及可读存储介质。

背景技术

数据的展示是可视化技术中一个非常重要的部分。传统的展示方式以二维的展示居多，具体以图表的方式对数据进行简单的展示。虽然也能满足数据展示的需求，但是无法更加生动形象，对于一些应用场景，不能真实和清晰的反应实际情况。

显然，在浏览器中，传统的二维展示功能已经不能很好的满足客户的需求。因此，如何在浏览器中生动形象的展示复杂繁多的数据是本领域技术人员需要解决的技术问题。

发明内容

为此，本发明的一个目的在于提出一种基于浏览器的数据可视化方法，以实现在浏览器中生动形象的展示复杂繁多的数据。

本发明提供一种基于浏览器的数据可视化方法，包括：

创建超文本标记语言文档，并在所述超文本标记语言文档中引入js文件；

在所述js文件中引入基于WebGL的浏览器3D引擎；

创建Atom类，在所述Atom类的构造函数中实例化所述浏览器3D引擎的绘制场景数据、字体数据以及动画效果数据；

设置初始函数，在所述初始函数中初始化所述浏览器3D引擎，以进行可视化绘制。

根据本发明提供的基于浏览器的数据可视化方法，通过在超文本标记语言文档(即html文档)中引入js文件(javascript文件)，并在js文件中引入基于WebGL的浏览器3D引擎，WebGL允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript绑定，WebGL可以为HTML5Canvas提供硬件3D加速渲染，能够实现在浏览器中流畅的展示3D场景和模型，通过调用浏览器3D引擎中的API生成场景，就能够绘制出3D模型，最终在浏览器中实现了三维展示的效果，相比二维展示更加生动形象，能够更加真实和清晰的反应实际情况。

另外，根据本发明上述的基于浏览器的数据可视化方法，还可以具有如下附加的技术特征：

进一步地，在所述超文本标记语言文档中引入js文件的步骤具体包括：

采用script标签type为module的方式在所述超文本标记语言文档中引入js文件。

进一步地，所述浏览器3D引擎采用three.js；

在所述js文件中引入基于WebGL的浏览器3D引擎的步骤具体包括：

在所述js文件中使用import语句引入three.js文件。

进一步地，在所述初始函数中初始化所述浏览器3D引擎的步骤具体包括：

在所述初始函数中初始化所述浏览器3D引擎的渲染器、相机、灯光、控制器以及动画，所述渲染器用于渲染场景中的物体，所述相机用于观察场景，所述灯光用于点亮场景，所述控制器控制所述相机的移动。

进一步地，进行可视化绘制的步骤具体包括：

绘制最外层的遮罩层，并将该所述遮罩层添加到所述场景数据中；