一种数据绘制方法和装置制造方法及图纸

技术编号:15910749 阅读:27 留言:0更新日期:2017-08-01 22:28
本发明专利技术实施例公开了一种数据绘制方法和装置;本发明专利技术实施例采用在浏览器上设置多个绘图画布,然后,获取多个待绘制数据,并对该多个待绘制数据进行分组,以得到多个数据组,其中,该数据组由至少一个待绘制数据组成,且数量与该绘图画面的数量相等,分别为每个该绘图画布分配对应的数据组,其中,一个数据组对应一个绘图画布,采用该绘图画布对与其对应的数据组进行图像绘制;该方案可以缩短绘图画布(比如canvas)绘制数据图像的时间,相对于现有技术而言,缩短了数据图像的显示时间,减缓了显示延迟。

Data drawing method and device

The embodiment of the invention discloses a method and a device for drawing a data; the embodiment of the invention adopts multiple drawing canvas in the browser, then get the drawing data of a plurality of stay, and grouping the plurality of data to be drawn, to obtain a plurality of data sets, which, according to the number of groups by at least one a data to be drawn, and the number of equal number and the drawing of the picture, which are data group, the distribution of each corresponding to the drawing canvas, a data set corresponding to a drawing canvas, the drawing canvas of the corresponding data sets for image rendering; this scheme can shorten the drawing canvas (such as canvas draw the image data), compared with the prior art, shorten the display time of the image data, slowing the display delay.

【技术实现步骤摘要】
一种数据绘制方法和装置
本专利技术涉及通信
,具体涉及一种数据绘制方法和装置。
技术介绍
HTML5是HTML(HyperTextMarkupLanguage,超文本标记语言)最新的修订版本,简称H5,2014年10月由万维网联盟(W3C)完成标准制定。目标是取代1999年所制定的HTML4.01和XHTML1.0标准,以期能在互联网应用迅速发展的时候,使网络标准达到符合当代的网络需求。Canvas为h5提供的一种高效绘图画布,可使用JavaScript脚本在网页上绘制图形,例如,画图,合成照片,创建动画甚至实时视频处理与渲染等。在对现有技术的研究和实践过程中,本专利技术的专利技术人发现,由于Canvas绘制数据的图像时需要在绘制完所有待绘制数据的图像之后,才会显示数据的图像,因此,在利用Canvas绘制大量数据的图像时绘制数据图像的时间比较长,会导致数据图像的显示时间较长和出现明显的显示延迟。
技术实现思路
本专利技术实施例提供一种数据绘制方法和装置,可以解决在利用Canvas绘制大量数据的图像时绘制数据图像的时间比较长,会导致数据图像的显示时间较长和出现明显的显示延迟的技术问题。本专利技术实施例提供一种数据绘制方法,包括:在浏览器上设置多个绘图画布;获取多个待绘制数据,并对所述多个待绘制数据进行分组,以得到多个数据组,其中,所述数据组由至少一个待绘制数据组成,且数量与所述绘图画面的数量相等;分别为所述每个所述绘图画布分配对应的所述数据组,其中,一个所述数据组对应一个所述绘图画布;采用所述绘图画布对与其对应的数据组进行图像绘制。相应的,本专利技术实施例还提供一种数据绘制装置,包括:设置单元,用于在浏览器上设置多个绘图画布;分组单元,用于获取多个待绘制数据,并对所述多个待绘制数据进行分组,以得到多个数据组,其中,所述数据组由至少一个待绘制数据组成,且数量与所述绘图画面的数量相等;分配单元,用于分别为所述每个所述绘图画布分配对应的所述数据组,其中,一个所述数据组对应一个所述绘图画布;绘制单元,用于采用所述绘图画布对与其对应的数据组进行图像绘制。本专利技术实施例采用在浏览器上设置多个绘图画布,然后,获取多个待绘制数据,并对该多个待绘制数据进行分组,以得到多个数据组,其中,该数据组由至少一个待绘制数据组成,且数量与该绘图画面的数量相等,分别为每个该绘图画布分配对应的数据组,其中,一个数据组对应一个绘图画布,采用该绘图画布对与其对应的数据组进行图像绘制;由于该方案可以将所有待绘制数据划分成多组数据,并采用多个绘图画布分别对多组待绘制数据进行绘制,缩短了绘图画布(比如canvas)绘制数据图像的时间,相对于现有技术而言,缩短了数据图像的显示时间,减缓了显示延迟。附图说明为了更清楚地说明本专利技术实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本专利技术的一些实施例,对于本领域技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。图1是本专利技术实施例一提供的数据绘制方法的流程图;图2是本专利技术实施例二提供的数据绘制方法的另一流程图;图3是本专利技术实施例三提供的数据绘制装置的结构示意图。具体实施方式下面将结合本专利技术实施例中的附图,对本专利技术实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本专利技术一部分实施例,而不是全部的实施例。基于本专利技术中的实施例,本领域技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本专利技术保护的范围。本专利技术实施例提供一种数据绘制方法和装置。以下将分别进行详细说明。实施例一、本实施例将从数据绘制装置的角度进行描述,该数据绘制装置具体可以集成在终端或其他需要进行数据绘制的设备中。一种数据绘制方法,其特征在于,包括:采用在浏览器上设置多个绘图画布,然后,获取多个待绘制数据,并对该多个待绘制数据进行分组,以得到多个数据组,其中,该数据组由至少一个待绘制数据组成,且数量与该绘图画面的数量相等,分别为每个该绘图画布分配对应的数据组,其中,一个数据组对应一个绘图画布,采用该绘图画布对与其对应的数据组进行图像绘制。如图1所示,该数据绘制的具体流程可以如下:101、在浏览器上设置多个绘图画布。该浏览器可以为支持h5的绘图画布的浏览器,例如,谷歌浏览器,火狐浏览器,Opera浏览器,QQ浏览器,以及IE浏览器等主流浏览器。该绘图画布可以为canvas画布。该多个绘图画布可以位于在不同层,此时,多个绘图画布即可成为多层绘图画布,例如,多个绘图画布重叠在浏览器上某个位置,这样可以节省浏览器资源。102、获取多个待绘制数据,并对该多个待绘制数据进行分组,以得到多个数据组,其中,数据组由至少一个待绘制数据组成,且数量与该绘图画面的数量相等。本实施例中,对数据进行分组的方式有多种,比如,可以对所有待绘制数据进行等分,以形成多个数据个数相同的数据组,即每个数据组的待绘制数量相同,以m个待绘制数据为例,此时,可将该m个数据划等分成n个数据组,每个数据组包含的数据个数相同;又比如,可以对所有待绘制数据进行划分,形成多个数据个数不相同的数据组,即每个数组的数据个数不相同;具体地,分组或者划分方式,以及数据组包含的数据个数均可以根据实际需求进行设定,比如,在设置了10个canvas画布时,将10万个数据分成10组,这10组的数据个数可以相同或者不同,也有可能是10组中有几组的数据个数相同,有几组数据个数不相同等。本实施例中,待绘制数据可以有多种,比如可以为定位数据等。103、分别为该每个绘图画布分配对应的数据组,其中,一个数据组对应一个绘图画布。本实施例分别为该每个绘图画布分配对应的数据组的方式有多种,可以依次为每个绘图画布分配对应的数据组,或者同时为每个绘图画布分配对应的数据组;其中,依次为每个绘图画布分配数据组的方式如下:(1)、可以根据绘图画布的标识依次为每个绘图画布分配对应的数据组,例如,可以按照标识的顺序依次为绘图画布分配对应的数据组,假设设置了5个canvas画布,即canvas1、canvas2、canvas3、canvas4、canvas5,将10万个数据分成5个数据组,包括数据组1、数据组2、数据组3、数据组4、数据组5,此时,可以先将数据组1分配给canvas1、然后,将数据组2分配给canvas2,依次类推,最后数据组5分配给canvas5。(2)、在多个绘图画布位于不同层时,可以根据绘图画布对应的层次为依次为每个绘图画布分配对应的数据组;例如,按照顶层到底层的顺序依次为绘图画布分配对应的数据组等等。104、采用该绘图画布对与其对应的数据组进行图像绘制。比如,采用每个canvas画布对与其对应的数据组中的待绘制数据进行图像绘制,该对数据组进行图像绘制指的是绘制数据组中每个待绘制数据的图像。具体地,采用绘图画布对与其对应的数据组进行图像绘制的方式有多种,比如,可以同时采用绘图画布对与其对应的数据组进行图像绘制,假设有10个canvas画布,同时采用这10个canvas画布对各自对应的数据组进行图像绘制,这种方式,可以大大减少绘图画布进行图像绘制的时间,缩短数据图像的显示时间。由于同时采用多个绘图画布进行图像绘制,在数据本文档来自技高网...
一种数据绘制方法和装置

【技术保护点】
一种数据绘制方法,其特征在于,包括:在浏览器上设置多个绘图画布;获取多个待绘制数据,并对所述多个待绘制数据进行分组,以得到多个数据组,其中,所述数据组由至少一个待绘制数据组成,且数量与所述绘图画面的数量相等;分别为每个所述绘图画布分配对应的所述数据组,其中,一个所述数据组对应一个所述绘图画布;采用所述绘图画布对与其对应的数据组进行图像绘制。

【技术特征摘要】
1.一种数据绘制方法,其特征在于,包括:在浏览器上设置多个绘图画布;获取多个待绘制数据,并对所述多个待绘制数据进行分组,以得到多个数据组,其中,所述数据组由至少一个待绘制数据组成,且数量与所述绘图画面的数量相等;分别为每个所述绘图画布分配对应的所述数据组,其中,一个所述数据组对应一个所述绘图画布;采用所述绘图画布对与其对应的数据组进行图像绘制。2.如权利要求1所述的数据绘制方法,其特征在于,所述采用所述绘图画布对与其对应的数据组进行图像绘制的步骤具体包括:依次采用所述绘图画布对与其对应的数据组进行图像绘制。3.如权利要求2所述的数据绘制方法,其特征在于,所述依次采用所述绘图画布对与其对应的数据组进行图像绘制的步骤具体包括:根据所述浏览器的刷新频率,依次采用所述绘图画布对与其对应的数据组进行图像绘制。4.如权利要求3所述的数据绘制方法,其特征在于,所述根据所述浏览器的刷新频率,依次采用所述绘图画布对与其对应的数据组进行图像绘制的步骤具体包括:根据所述浏览器的刷新频率确定绘制图像的时间间隔;根据所述时间间隔,依次采用所述绘图画布对与其对应的数据组进行图像绘制。5.如权利要求1-4任一项所述的数据绘制方法,其特征在于,所述在浏览器上设置多个绘图画布的步骤具体包括:根据预设图像显示时间和待绘制数据的预设数量,确定需要绘图画布的数量,该数量大于1;根据确定的数量...

【专利技术属性】
技术研发人员:李一非
申请(专利权)人:腾讯科技深圳有限公司
类型:发明
国别省市:广东,44

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1