[发明专利]图像处理方法及图像处理系统

说明书

本发明涉及绘图技术领域，公开一种图像处理方法及系统。所述图像处理方法包括：按照图形元素的层叠值存储多个图形元素集合，其中，每个图形元素集合中的多个图形元素的层叠值相同，及每个图形元素集合包括属于不同图形类型的至少一个图形元素组，每个图形元素组包括多个矢量图形；为每个图形元素集合创建相应的第一渲染器；针对每个图形元素集合，采用所述相应的第一渲染器，并行对至少一个图形元素组中的每一者进行路径绘制与渲染；及按照所述图形元素的层叠值升序的方式，将已被渲染的所述多个图形元素集合绘制在第二渲染器中。本发明可对同一图层上的属于同一图形类型的多个矢量图形并行路径绘制与渲染，从而可极大地提高2D绘图的渲染性能。

技术领域

本发明涉及绘图技术领域，具体地涉及一种图像处理方法及图像处理系统。

背景技术

通常，在万维网(Web)页面中对二维(2D)矢量图进行绘制，但在2D矢量图数量达到一定量级(如绘图密集型web应用)后，客户端的用户机器CPU负载大幅上升，相应渲染器的渲染性能急剧下降。由此，在动画场景下出现卡顿的现象，从而使得用户体验下降。

发明内容

本发明的目的是提供一种图像处理方法及图像处理系统，其可对2D绘图进行分图层渲染，尤其是对同一图层上的属于同一图形类型的多个矢量图形并行路径绘制与渲染，从而可极大地提高2D绘图的渲染性能。

为了实现上述目的，本发明第一方面提供一种图像处理方法，所述图像处理方法包括：按照图形元素的层叠值存储多个图形元素集合，其中，所述多个图形元素集合中的每个图形元素集合中的多个图形元素的层叠值相同，以及所述每个图形元素集合包括属于不同图形类型的至少一个图形元素组，所述至少一个图形元素组中的每一者包括多个矢量图形；为所述每个图形元素集合创建相应的第一渲染器；针对所述每个图形元素集合，采用所述相应的第一渲染器，并行对所述至少一个图形元素组中的每一者进行路径绘制与渲染；以及按照所述图形元素的层叠值升序的方式，将已被渲染的所述多个图形元素集合绘制在第二渲染器中。

优选地，所述为所述每个图形元素集合创建相应的第一渲染器包括：检测绘图渲染环境；以及根据所检测的所述绘图环境，为所述每个图形元素集合创建相应的第一渲染器。

优选地，所述根据所检测的所述绘图环境，为所述每个图形元素集合创建相应的第一渲染器包括：在所检测的所述绘图环境支持离屏渲染器的情况下，为所述每个图形元素集合创建相应的离屏渲染器；在所检测的所述绘图环境支持位图渲染器的情况下，为所述每个图形元素集合创建相应的位图渲染器；或者在所检测的所述绘图环境不支持离屏渲染器或位图渲染器的情况下，为所述每个图形元素集合创建相应的2D画布。

优选地，所述并行对所述至少一个图形元素组中的每一者进行路径绘制与渲染包括：针对所述每个图形元素集合，采用所述相应的第一渲染器执行以下操作：并行对所述至少一个图形元素组中的每一者进行路径绘制；以及并行对所述至少一个图形元素组中的每一者的已被绘制的路径进行渲染。

优选地，在执行所述按照图形元素的层叠值存储多个图形元素集合之前，所述图像处理方法还包括：针对所述每个图形元素集合，执行以下操作：创建所述多个图形元素中的每个图形元素；以及为所述每个图形元素配置相应的标识。

优选地，在执行所述将已被渲染的所述多个图形元素集合绘制在第二渲染器中之后，所述图像处理方法还包括：在特定图形元素集合发生更新的情况下，采用所述与所述特定图形元素集合相对应的渲染器，并行对所述特定图形元素集合中的至少一个图形元素组中的每一者进行路径绘制与渲染；以及清除所述第二渲染器中已绘制的所述多个图形元素集合，并按照所述图形元素的层叠值升序的方式，并将已被渲染的更新后的所述多个图形元素集合绘制在第二渲染器中。

优选地，所述图像处理方法还包括：在特定图形元素集合中的图形元素的数量发生变化的情况下，确定所述特定图形元素集合发生更新。