CN105303506A - 一种基于html5的数据并行处理方法及*** - Google Patents

一种基于html5的数据并行处理方法及*** Download PDF

Info

Publication number
CN105303506A
CN105303506A CN201410274909.6A CN201410274909A CN105303506A CN 105303506 A CN105303506 A CN 105303506A CN 201410274909 A CN201410274909 A CN 201410274909A CN 105303506 A CN105303506 A CN 105303506A
Authority
CN
China
Prior art keywords
data
parallel
texture image
html5
result
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201410274909.6A
Other languages
English (en)
Other versions
CN105303506B (zh
Inventor
张颖
卢伟超
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
TCL Corp
Original Assignee
TCL Corp
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by TCL Corp filed Critical TCL Corp
Priority to CN201410274909.6A priority Critical patent/CN105303506B/zh
Publication of CN105303506A publication Critical patent/CN105303506A/zh
Application granted granted Critical
Publication of CN105303506B publication Critical patent/CN105303506B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Landscapes

  • Image Generation (AREA)

Abstract

本发明公开了一种基于HTML5的数据并行处理方法及***,根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;将所述纹理图像并行计算结果转换为对应的数据并行计算结果;通过将数据转换为纹理图像进行并行计算处理得到纹理图像并行计算结果,并转换为对应的数据并行计算结果,从而在Web平台上实现了通用的数据并行计算处理,使得并行处理能脱离桌面版PC服务器的传统方式,大大丰富了大数据并行处理技术的使用范围。

Description

一种基于HTML5的数据并行处理方法及***
技术领域
本发明涉及web数据处理领域,尤其涉及的是一种基于HTML5的数据并行处理方法及***。
背景技术
大数据的并行处理和展示,一直以来都是高性能服务器专用,譬如桌面版的CUDA(ComputeUnifiedDeviceArchitecture,统一计算架构)、OpenCL(OpenComputingLanguage,开放计算语言)等就是为了处理这个问题。其中,CUDA是一种由NVIDIA(全称为NVIDIAporation,NASDAQ:NVDA,官方中文名称英伟达)推出的通用并行计算架构,该架构使GPU能够解决复杂的计算问题。它包含了CUDA指令集架构(ISA)以及GPU内部的并行计算引擎。而OpenCL是一个为异构平台编写程序的框架,此异构平台可由CPU,GPU或其他类型的处理器组成。
CUDA等传统处理方式的数据处理使用类似于C的底层语言,需要学习语言的成本。同时,还要在不同操作***配置各种不同的SDK(SoftwareDevelopmentKit,软件开发工具包),开发环境,调试环境,开发成本高。且CUDA等传统处理方式处理计算结果一般是一大堆数据,不利于展示。
虽然从展示和易用性来讲,基于Web会有更好的体验,但Web平台没有成熟的标准以及框架,所以如何基于Web平台进行通用并行处理,以及如何通过Web展示大量数据计算结果是一个值得研究的问题。
因此,现有技术还有待于改进和发展。
发明内容
本发明要解决的技术问题在于,提供一种基于HTML5的数据并行处理方法及***,旨在解决现有的并行计算处理不方便、且基于Web平台无法进行并行处理的问题。
本发明解决技术问题所采用的技术方案如下:
一种基于HTML5的数据并行处理方法,其中,包括以下步骤:
A、根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;
B、根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;
C、通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;
D、将所述纹理图像并行计算结果转换为对应的数据并行计算结果。
所述的基于HTML5的数据并行处理方法,其中,所述步骤C还包括:
C10、将所述纹理图像并行计算结果在WebGL标准显示***上进行2D或3D显示。
所述的基于HTML5的数据并行处理方法,其中,在所述步骤A中,所述绘制区域的大小不超过所述WebGL标准显示***的屏幕分辨率的长和宽之积。
所述的基于HTML5的数据并行处理方法,其中,所述步骤B具体包括:
B1、所述需要进行并行处理的数据为多个float数据,将所述多个float数据一一转换为对应的RGBA数据;
B2、根据所述绘制区域和多个RGBA数据生成对应的纹理图像。
所述的基于HTML5的数据并行处理方法,其中,所述步骤C具体包括:
C1、获取所述纹理图像的各个像素的RGBA数据;
C2、根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据;
C3、通过预先根据Shader语言编写的并行计算算法对所述多个float数据进行并行计算处理,得到对应的数据并行计算结果;
C4、将所述数据并行计算结果转换为对应的纹理图像并行计算结果。
一种基于HTML5的数据并行处理***,其中,包括:
绘制区域设置模块,用于根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;
纹理图像转换模块,用于根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;
并行计算模块,用于通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;
结果转换模块,用于将所述纹理图像并行计算结果转换为对应的数据并行计算结果。
所述的基于HTML5的数据并行处理***,其中,还包括:
显示模块,用于将所述纹理图像并行计算结果在WebGL标准显示***上进行2D或3D显示。
所述的基于HTML5的数据并行处理***,其中,所述绘制区域的大小不超过所述WebGL标准显示***的屏幕分辨率的长和宽之积。
所述的基于HTML5的数据并行处理***,其中,所述纹理图像转换模块包括:
数据转换单元,用于所述需要进行并行处理的数据为多个float数据,将所述多个float数据一一转换为对应的RGBA数据;
纹理图像生成单元,用于根据所述绘制区域和多个RGBA数据生成对应的纹理图像。
所述的基于HTML5的数据并行处理***,其中,所述并行计算模块包括:
颜色值获取单元,用于获取所述纹理图像的各个像素的RGBA数据;
还原单元,用于、根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据;
并行计算单元,用于通过预先根据Shader语言编写的并行计算算法对所述多个float数据进行并行计算处理,得到对应的数据并行计算结果;
结果转换单元,用于将所述数据并行计算结果转换为对应的纹理图像并行计算结果。
本发明所提供的一种基于HTML5的数据并行处理方法及***,有效地解决了现有的并行计算处理不方便、且基于Web平台无法进行并行处理的问题,通过根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;将所述纹理图像并行计算结果转换为对应的数据并行计算结果;通过将数据转换为纹理图像,再对纹理图像进行并行计算处理得到纹理图像并行计算结果并转换为对应的数据并行计算结果,通过使用HTML5开发平台,直接使用WebGL标准进行计算,从而在Web平台上实现了通用的数据并行计算处理,实现了一个通用型的数据并行处理的Web***,使得并行处理能脱离桌面版PC服务器的传统方式,大大丰富了大数据并行处理技术的使用范围,带来了大大的方便。
附图说明
图1为本发明提供的基于HTML5的数据并行处理方法较佳实施例的流程图。
图2为本发明提供的基于HTML5的数据并行处理***较佳实施例的结构框图。
具体实施方式
本发明提供一种基于HTML5的数据并行处理方法及***,为使本发明的目的、技术方案及优点更加清楚、明确,以下参照附图并举实施例对本发明进一步详细说明。应当理解,此处所描述的具体实施例仅仅用以解释本发明,并不用于限定本发明。
为了便于理解本发明,首先阐述一下本发明的工作原理。本发明是基于HTML5的Web平台上进行数据并行计算处理。HTML5是HTML下一个主要的修订版本,现在仍处于发展阶段,目标是取代1999年所制定的HTML4.01和XHTML1.0标准,以其能在互联网应用迅速发展的时候,使网络标准达到符合当代的网络需求。HTML5标准中的一个组成部分是WebGL,而WebGL基于OpenGL,可以在网页上直接调用图形API接口继而调用GPU,从而实现3D渲染等功能。OpenGL,即OpenGraphicsLibrary,是个定义了一个跨编程语言、跨平台的编程接口的规格,它用于三维图象(二维亦可)。OpenGL是个专业的图形程序接口,是一个功能强大,调用方便的底层图形库。而WebGL是一种3D绘图标准,这种绘图技术标准允许把JavaScript和OpenGLES2.0结合在一起,通过增加OpenGLES2.0的一个JavaScript绑定,WebGL可以为HTML5Canvas提供硬件3D加速渲染,这样Web开发人员就可以借助***显卡来在浏览器里更流畅地展示3D场景和模型,还能创建复杂的导航和数据视觉化。
3D渲染对物体的绘制主要包括顶点着色和像素着色两个部分。顶点着色部分是对每个顶点进行处理。像素着色是对片元的每个像素点进行着色处理。而不同顶点的着色使用Shader(着色器)语言是并行处理的。像素也是一样,某个片元显示区域的像素也是通过Shader语言并行着色的。这样才能通过GPU实现大规模的并行着色计算。
WebGL的着色处理主要是应用在物体的绘制方面,能根据自定义的着色算法提供各种各样的着色解决方案。本发明基于着色的并行处理功能,由于着色的计算是通过Shader语言自定义编程完成的。通过对着色的算法进行修改,可修改成通用型的并行计算算法。然后将需要计算的多份输入数据转化为多个像素buffer(缓冲区)也就是纹理图像,使用修改过的着色算法进行并行处理,并将着色结果的像素buffer也就是纹理图像作为结果数据。
进一步地,由于纹理图像在WebGL***可以直接被绘制到屏幕上去,所以计算的输入和输出都很方便的能作为2D图片或者3D立体图像来显示。
也就是说,WebGL本来是画物体计算像素颜色的,颜色计算过程可以自定义GPU算法并行处理。本发明将数据转化为像素颜色进行并行计算,再把计算结果从像素颜色转为数据,从而使得在基于HTML5的Web平台上也能进行数据并行计算处理;进一步地因像素颜色本身可以方便的作为2d或3d图形显示,所以计算过程和结果是可以做到可视化的;从而实现了一个通用型的数据并行处理以及Web展示***,使得数据并行计算处理能脱离现有的桌面版PC服务器的传统方式,在Web平台上也能进行数据并行计算处理,并且用Web形式更利于宣传以及展示,可把每一个用户的浏览器都变成一个自定制的并行处理以及显示平台,大大丰富了大数据处理并行计算处理的使用范围。
请参阅图1,图1为本发明提供的基于HTML5的数据并行处理方法较佳实施例的流程图,如图所示,所述方法包括以下步骤:
步骤S100、根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;
步骤S200、根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;
步骤S300、通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;
步骤S400、将所述纹理图像并行计算结果转换为对应的数据并行计算结果。
下面结合具体的实施例对上述步骤进行详细的描述。
在步骤S100中,根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小。具体来说,首先需要分析计算规模以及初始化WebGL标准显示***。关于WebGL标准显示***初始化由于有HTML5标准API规定,此处不再赘述。关于计算规模分析,主要是分析需要进行并行处理的数据大小,并行处理算法复杂度等,从而设置WebGL标准显示***部分参数,譬如绘制区域大小。在实际应用时,所述绘制区域的大小不超过所述WebGL标准显示***的屏幕分辨率的长和宽之积。
举例说明如下:需要进行并行处理的数据包括4份数据量,每份数据量为1百万个float数据,其中float为CSS的一种属性,主要属性值为:left(左浮动)、none(不浮动)、right(右浮动)、inherit(继承父元素浮动),多用于网页排版。这4份数据量要使用某个特定的计算过程(这个计算过程可能使用多个公式),最终得到一份1百万的结果数据。
依次分析每份数据量,由于要转化为像素buffer进行计算。所以可以分配为1000*1000大小的屏幕视口范围。通过WebGL标准可以设置viewport(绘制区域)视口为长为1000、宽为1000。并且设置需要绘制的4个顶点坐标为(-1,-1,0;-1,1,0;1,1,0;1,-1,0)并设置投影为正交投影。因为WebGL3D空间的坐标范围是-1到1,所以这样设置是绘制区域要完整覆盖整个1000x1000区域。需要说明的是,这个绘制区域大小不要超过屏幕分辨率的长与宽之积。若超过,则可使用多个Shader计算。也就是多次重复计算1百万个数据,从而生成多个对应的纹理图像。
在步骤S200中,根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像。具体来说,就是根据所述需要进行并行处理的数据和所述绘制区域生成对应的纹理图像。举例说明如下:上述的4份数据量,每个1000x1000个float数据,把每一份数据量都使用WebGL的纹理生成接口teximage2d,做成一个GL_RGBA的1000x1000的纹理图像(RGBA各自占一个字节,4个字节正好能表示一个float,Float用4个Byte表示的方法很多),这样4份输入数据会产生4个对应的纹理图像。这四个纹理图像其实就是4个显存的buffer,buffer的每一个像素颜色其实都是数据。
在实际应用时,所述需要进行并行处理的数据为多个float数据,首先将所述多个float数据一一转换为对应的RGBA数据;再根据所述绘制区域和多个RGBA数据生成对应的纹理图像。其中,RGBA是代表Red(红色)、Green(绿色)、Blue(蓝色)和Alpha(亮度)的色彩空间。关于如何将float数据一一转换为对应的RGBA数据,此处可以有多种方式进行转换,譬如、一个float数据有32位,而RGBA数据也对应有32位,可将float数据的第一个8位转换为R,第二个8位转换为G,第三个8位转换成B,第四个8位转换成A。由于后续也要将RGBA数据转换为对应的float数据,因此该转换是中间过程,所以可有多种转换方式,譬如将第一个8位转换为A,第二个8位转换成B,第三个8位对应G,第四个8位对应R,只要记住float与RGBA的转换关系便可,由于最后还会将RGBA转换为float,因此具体的转换关系可根据需求进行设置,不会影响最终的并行计算结果。
在步骤S300中,通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果。具来说,WebGL支持多个纹理图像作为像素Shader计算的输入,只需要使用bind功能绑定步骤S200产生的纹理图像,就可以把纹理图像作为像素Shader的输入。
所述步骤S300具体包括:S310、获取所述纹理图像的各个像素的RGBA数据;S320、根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据;S330、通过预先根据Shader语言编写的并行计算算法对所述多个float数据进行并行计算处理,得到对应的数据并行计算结果;S340、将所述数据并行计算结果转换为对应的纹理图像并行计算结果。
在实际应用时,先根据像素位置(uv坐标),获取需要进行并行处理的数据的当前像素的颜色值即RGBA数据。也就是由于需要进行并行处理的数据是作为纹理图像传进来的。这里获取纹理图像的各个像素的RGBA数据。由于float数据在输入时候,用RGBA数据(4个字节)表示的。然后在像素Shader程序的开始先使用与步骤S200中相反的算法,把RGBA4个字节还原为对应的float数据,也就是说根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据。再通过预先根据Shader语言编写的并行计算算法对还原好的多个float数据进行并行计算处理,从而得到对应的数据并行计算结果。譬如4个float数据为a,b,c,d。这里就写好算法result=a+b+c+d。因为Shader支持各种计算包括sin、cos、平方及开方等,这里预先设置好并行计算的算法,也就是和桌面版并行处理一样的算法。最后将所述数据并行计算结果转换为对应的纹理图像并行计算结果。由于WebGL***只支持输出RGBA数据类型的结果,也就是WebGL只输出图像,因此在上述步骤得到的result会转为对应的RGBA进行输出,也就是输出纹理图像并行计算结果,并在屏幕上绘制,结果也是一个图像。
举例说明如下:步骤S300就是要在绘制区域为1000×1000的屏幕上绘制最终颜色。绘制最终颜色就是1000×1000个像素点,每一个都计算出来最终的RGBA数据。这个时候再获取最终屏幕上1000×1000像素范围的RGBA值。拿到每个颜色值的RGBA再转化为result(结果)。这个1000×1000个result就是我们最终的计算结果,这样给GPU的颜色计算程序就完成了。本发明是基于HTML5的WebGL标准,使用GPU进行并行处理。而CUDA等传统方式也是采取同样的GPU并行单元计算,执行并行处理的最终硬件方案是完全相同的,所以此处不做过多描述。
在步骤S400中,将所述纹理图像并行计算结果转换为对应的数据并行计算结果。具体来说,此处的还原与步骤S200中的转换互为逆运算,在步骤S300中得到纹理图像并行计算结果后,再将纹理图像并行计算结果还原为对应的数据并行计算结果,这个数据并行计算结果就是在基于HTML5的Web平台上对需要进行并行处理的数据进行并行计算后的结果。
进一步地,由于纹理图像并行计算结果还是为图像,可将所述纹理图像并行计算结果在WebGL标准显示***上进行2D或3D显示。
在实际应用时,CUDA等传统处理方式处理计算结果一般是一大堆数据,不利于展示。如果要进行2D/3D展示还需要把数据再使用OpenGL、WebGL重新处理绘制。
本发明在步骤S200中,输入的数据已经被做成了纹理图像。而步骤S300中计算的结果也输出到屏幕上获取为纹理图像。而WebGL的纹理图像是可以直接显示到屏幕上的。不但可以作为2D图像显示还可以使用特定的效果,例如网格化,通过Shader语言生成3D高度曲面展示,或高度地形等显示。这些纹理图像本身就是WebGL***中的buffer,所以不需要重复输入。这样可以迅速将输入buffer以及结果buffer做成各式各样的2D/3D元素,构建数据可视化。进一步地,可以把计算结果发布到网站。并且由于每个人的计算机都可以进行上面的计算,所以可以在每个网站浏览者的浏览器页面,从而可让用户进行个性化的计算。
本发明在HTML5的Web平台上,实现了一个通用型的数据并行处理以及Web展示,使得数据并行处理能脱离桌面版PC服务器的传统方式,大大丰富了大数据并行处理技术的使用范围。进一步地,本发明通过使用HTML5开发平台,直接使用WebGL进行计算,计算结果不但可以作为数据分析,还可以使用Web平台,将数据无需特殊处理就可作为2D图像以及3D图表展示,更加直观(因WebGL本来就是用于2D/3D显示的技术),也可以直接发布到网站用于实时计算,从展示的角度实现了数据计算的可视化和网页发布等功能,用Web形式更利于宣传以及展示,更加适合于现代计算的要求,带来了大大的方便。
基于上述基于HTML5的数据并行处理方法,本发明实施例还提供了一种基于HTML5的数据并行处理***,如图2所示,所述***包括:
绘制区域设置模块10,用用于根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;具体如步骤S100所述;
纹理图像转换模块20,用于根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;具体如步骤S200所述;
并行计算模块30,用于通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;具体如步骤S300所述;
结果转换模块40,用于将所述纹理图像并行计算结果转换为对应的数据并行计算结果;具体如步骤S400所述。
进一步地,所述的基于HTML5的数据并行处理***,还包括:
显示模块,用于将所述纹理图像并行计算结果在WebGL标准显示***上进行2D或3D显示。
进一步地,所述绘制区域的大小不超过所述WebGL标准显示***的屏幕分辨率的长和宽之积。
进一步地,所述纹理图像转换模块20包括:
数据转换单元,用于所述需要进行并行处理的数据为多个float数据,将所述多个float数据一一转换为对应的RGBA数据;
纹理图像生成单元,用于根据所述绘制区域和多个RGBA数据生成对应的纹理图像。
进一步地,所述并行计算模块30包括:
颜色值获取单元,用于获取所述纹理图像的各个像素的RGBA数据;
还原单元,用于、根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据;
并行计算单元,用于通过预先根据Shader语言编写的并行计算算法对所述多个float数据进行并行计算处理,得到对应的数据并行计算结果;
结果转换单元,用于将所述数据并行计算结果转换为对应的纹理图像并行计算结果。
综上所述,本发明实施例提供的一种基于HTML5的数据并行处理方法及***,根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;将所述纹理图像并行计算结果转换为对应的数据并行计算结果;通过把数据转化为纹理图像进行并行计算,再把纹理图像并行计算结果对应从像素颜色转为数据并行计算结果,从而实现了在Web平台上对数据进行通用并行计算处理,提供了一个通用型的数据并行处理的Web***,使得并行处理能脱离桌面版PC服务器的传统方式,大大丰富了大数据并行处理技术的使用范围。进一步地,由于像素颜色本身可以方便的作为2D或3D图形显示,则计算过程和结果是可做到可视化,从而带来了大大的方便。
应当理解的是,本发明的应用不限于上述的举例,对本领域普通技术人员来说,可以根据上述说明加以改进或变换,所有这些改进和变换都应属于本发明所附权利要求的保护范围。

Claims (10)

1.一种基于HTML5的数据并行处理方法,其特征在于,包括以下步骤:
A、根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;
B、根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;
C、通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;
D、将所述纹理图像并行计算结果转换为对应的数据并行计算结果。
2.根据权利要求1所述的基于HTML5的数据并行处理方法,其特征在于,所述步骤C还包括:
C10、将所述纹理图像并行计算结果在WebGL标准显示***上进行2D或3D显示。
3.根据权利要求1所述的基于HTML5的数据并行处理方法,其特征在于,在所述步骤A中,所述绘制区域的大小不超过所述WebGL标准显示***的屏幕分辨率的长和宽之积。
4.根据权利要求1所述的基于HTML5的数据并行处理方法,其特征在于,所述步骤B具体包括:
B1、所述需要进行并行处理的数据为多个float数据,将所述多个float数据一一转换为对应的RGBA数据;
B2、根据所述绘制区域和多个RGBA数据生成对应的纹理图像。
5.根据权利要求4所述的基于HTML5的数据并行处理方法,其特征在于,所述步骤C具体包括:
C1、获取所述纹理图像的各个像素的RGBA数据;
C2、根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据;
C3、通过预先根据Shader语言编写的并行计算算法对所述多个float数据进行并行计算处理,得到对应的数据并行计算结果;
C4、将所述数据并行计算结果转换为对应的纹理图像并行计算结果。
6.一种基于HTML5的数据并行处理***,其特征在于,包括:
绘制区域设置模块,用于根据需要进行并行处理的数据大小,设置WebGL标准显示***的绘制区域大小;
纹理图像转换模块,用于根据所述绘制区域将所述数据转换为对应的WebGL标准的纹理图像;
并行计算模块,用于通过预先根据Shader语言编写的并行计算算法对所述纹理图像进行并行计算处理,得到对应的纹理图像并行计算结果;
结果转换模块,用于将所述纹理图像并行计算结果转换为对应的数据并行计算结果。
7.根据权利要求6所述的基于HTML5的数据并行处理***,其特征在于,还包括:
显示模块,用于将所述纹理图像并行计算结果在WebGL标准显示***上进行2D或3D显示。
8.根据权利要求6所述的基于HTML5的数据并行处理***,其特征在于,所述绘制区域的大小不超过所述WebGL标准显示***的屏幕分辨率的长和宽之积。
9.根据权利要求6所述的基于HTML5的数据并行处理***,其特征在于,所述纹理图像转换模块包括:
数据转换单元,用于所述需要进行并行处理的数据为多个float数据,将所述多个float数据一一转换为对应的RGBA数据;
纹理图像生成单元,用于根据所述绘制区域和多个RGBA数据生成对应的纹理图像。
10.根据权利要求9所述的基于HTML5的数据并行处理***,其特征在于,所述并行计算模块包括:
颜色值获取单元,用于获取所述纹理图像的各个像素的RGBA数据;
还原单元,用于、根据所述多个RGBA数据将所述纹理图像还原为所述多个float数据;
并行计算单元,用于通过预先根据Shader语言编写的并行计算算法对所述多个float数据进行并行计算处理,得到对应的数据并行计算结果;
结果转换单元,用于将所述数据并行计算结果转换为对应的纹理图像并行计算结果。
CN201410274909.6A 2014-06-19 2014-06-19 一种基于html5的数据并行处理方法及*** Active CN105303506B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201410274909.6A CN105303506B (zh) 2014-06-19 2014-06-19 一种基于html5的数据并行处理方法及***

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201410274909.6A CN105303506B (zh) 2014-06-19 2014-06-19 一种基于html5的数据并行处理方法及***

Publications (2)

Publication Number Publication Date
CN105303506A true CN105303506A (zh) 2016-02-03
CN105303506B CN105303506B (zh) 2018-10-26

Family

ID=55200736

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201410274909.6A Active CN105303506B (zh) 2014-06-19 2014-06-19 一种基于html5的数据并行处理方法及***

Country Status (1)

Country Link
CN (1) CN105303506B (zh)

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106339430A (zh) * 2016-08-18 2017-01-18 合肥大明节能科技股份有限公司 基于地图api的海量覆盖物绘制方法
CN106709864A (zh) * 2016-12-08 2017-05-24 彭志勇 基于WebGL的大容量图像缓存方法
WO2018018941A1 (zh) * 2016-07-28 2018-02-01 武汉斗鱼网络科技有限公司 利用OpenGL与OpenCL协作实现图像缩放的方法及***
CN108845978A (zh) * 2018-05-24 2018-11-20 苏州乐麟无线信息科技有限公司 一种图表的生成方法和装置
CN109408028A (zh) * 2018-09-21 2019-03-01 东软集团股份有限公司 浮点数运算方法、装置及存储介质
CN110231928A (zh) * 2018-03-06 2019-09-13 北京京东尚科信息技术有限公司 用于处理浮点数的***、浮点数处理方法及装置
CN113256775A (zh) * 2021-06-03 2021-08-13 武汉华信联创技术工程有限公司 一种基于gpu共享纹理的气象三维数据前端可视化方法

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102216941A (zh) * 2008-08-19 2011-10-12 数字标记公司 用于内容处理的方法和***
CN102609507A (zh) * 2012-02-03 2012-07-25 浙江工业大学 基于Web的数据可视化***
US20130077887A1 (en) * 2011-01-18 2013-03-28 Dimension, Inc. Methods and systems for up-scaling a standard definition (sd) video to high definition (hd) quality

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102216941A (zh) * 2008-08-19 2011-10-12 数字标记公司 用于内容处理的方法和***
US20130077887A1 (en) * 2011-01-18 2013-03-28 Dimension, Inc. Methods and systems for up-scaling a standard definition (sd) video to high definition (hd) quality
CN102609507A (zh) * 2012-02-03 2012-07-25 浙江工业大学 基于Web的数据可视化***

Cited By (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2018018941A1 (zh) * 2016-07-28 2018-02-01 武汉斗鱼网络科技有限公司 利用OpenGL与OpenCL协作实现图像缩放的方法及***
CN106339430A (zh) * 2016-08-18 2017-01-18 合肥大明节能科技股份有限公司 基于地图api的海量覆盖物绘制方法
CN106339430B (zh) * 2016-08-18 2019-09-13 合肥大明节能科技股份有限公司 基于地图api的海量覆盖物绘制方法
CN106709864A (zh) * 2016-12-08 2017-05-24 彭志勇 基于WebGL的大容量图像缓存方法
CN110231928A (zh) * 2018-03-06 2019-09-13 北京京东尚科信息技术有限公司 用于处理浮点数的***、浮点数处理方法及装置
CN108845978A (zh) * 2018-05-24 2018-11-20 苏州乐麟无线信息科技有限公司 一种图表的生成方法和装置
CN109408028A (zh) * 2018-09-21 2019-03-01 东软集团股份有限公司 浮点数运算方法、装置及存储介质
CN109408028B (zh) * 2018-09-21 2021-03-05 东软集团股份有限公司 浮点数运算方法、装置及存储介质
CN113256775A (zh) * 2021-06-03 2021-08-13 武汉华信联创技术工程有限公司 一种基于gpu共享纹理的气象三维数据前端可视化方法

Also Published As

Publication number Publication date
CN105303506B (zh) 2018-10-26

Similar Documents

Publication Publication Date Title
CN105303506A (zh) 一种基于html5的数据并行处理方法及***
EP4120199A1 (en) Image rendering method and apparatus, and electronic device and storage medium
JP2019053736A (ja) 画像プロセッサのためのラインバッファユニット
CN106484408A (zh) 一种基于html5的节点关系图显示方法及***
CN110544290A (zh) 数据渲染方法及装置
TW201810036A (zh) 用於映射程式碼至一高效能、高功率效率、可程式化之影像處理硬體平台的編譯器技術
CN103337093B (zh) 一种基于Unity3D着色器实现三维机房实时温场效果的方法
US20140244219A1 (en) Method of creating a pipe route line from a point cloud in three-dimensional modeling software
CN111091620B (zh) 基于图形学的地图动态路网处理方法及***、计算机设备
CN101739897A (zh) 一种基于plt文件的广告字三维显示方法
TWI650013B (zh) 用於影像處理器之巨型輸入/輸出單元
Shi et al. Application research of virtual reality technology in ocean environmental art design
JP2005055573A (ja) 高速表示処理装置
CN112580213A (zh) 电场线的显示图像的生成方法和装置、存储介质
CN105045726B (zh) 一种基于并行计算的图片操作方法及***
DE102020106728A1 (de) Hintergrundschätzung für Objektsegmentierung mittels Grobstufenverfolgung
WO2023005934A1 (zh) 数据处理方法、***及电子设备
CN111324658A (zh) 一种海洋温度的可视化分析方法、智能终端及存储介质
CN103824310B (zh) 一种生成光特效文字的方法及装置
Le Van et al. An effective RGB color selection for complex 3D object structure in scene graph systems
Wang et al. LVDIF: a framework for real-time interaction with large volume data
CN111681307A (zh) 一种应用于三维软件的动态三维坐标轴的实现方法
KR20220126063A (ko) 재구성된 이미지를 생성하는 이미지 처리 방법 및 장치
JP2004233711A (ja) 地図データ構築装置
Koliha et al. Towards online visualization and interactive monitoring of real-time CFD simulations on commodity hardware

Legal Events

Date Code Title Description
C06 Publication
PB01 Publication
C10 Entry into substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant