[發明專利]圖像處理方法及圖像處理系統

在審

• 申請號: 202110252136.1
• 申請日: 2021-03-08
• 公開（公告）號: CN113052928A
• 公開（公告）日: 2021-06-29
• 發明（設計）人: 陳宗豪
• 申請（專利權）人: 北京房江湖科技有限公司
• 主分類號: G06T11/00
• 分類號: G06T11/00;G06T15/00
• 代理公司: 北京潤平知識產權代理有限公司 11283
• 代理人: 肖冰濱;王曉曉

本發明涉及繪圖技術領域，公開一種圖像處理方法及系統。所述圖像處理方法包括：按照圖形元素的層疊值存儲多個圖形元素集合，其中，每個圖形元素集合中的多個圖形元素的層疊值相同，及每個圖形元素集合包括屬于不同圖形類型的至少一個圖形元素組，每個圖形元素組包括多個矢量圖形；為每個圖形元素集合創建相應的第一渲染器；針對每個圖形元素集合，采用所述相應的第一渲染器，并行對至少一個圖形元素組中的每一者進行路徑繪制與渲染；及按照所述圖形元素的層疊值升序的方式，將已被渲染的所述多個圖形元素集合繪制在第二渲染器中。本發明可對同一圖層上的屬于同一圖形類型的多個矢量圖形并行路徑繪制與渲染，從而可極大地提高2D繪圖的渲染性能。

技術領域

本發明涉及繪圖技術領域，具體地涉及一種圖像處理方法及圖像處理系統。

背景技術

通常，在萬維網(Web)頁面中對二維(2D)矢量圖進行繪制，但在2D矢量圖數量達到一定量級(如繪圖密集型web應用)后，客戶端的用戶機器CPU負載大幅上升，相應渲染器的渲染性能急劇下降。由此，在動畫場景下出現卡頓的現象，從而使得用戶體驗下降。

發明內容

本發明的目的是提供一種圖像處理方法及圖像處理系統，其可對2D繪圖進行分圖層渲染，尤其是對同一圖層上的屬于同一圖形類型的多個矢量圖形并行路徑繪制與渲染，從而可極大地提高2D繪圖的渲染性能。

為了實現上述目的，本發明第一方面提供一種圖像處理方法，所述圖像處理方法包括：按照圖形元素的層疊值存儲多個圖形元素集合，其中，所述多個圖形元素集合中的每個圖形元素集合中的多個圖形元素的層疊值相同，以及所述每個圖形元素集合包括屬于不同圖形類型的至少一個圖形元素組，所述至少一個圖形元素組中的每一者包括多個矢量圖形；為所述每個圖形元素集合創建相應的第一渲染器；針對所述每個圖形元素集合，采用所述相應的第一渲染器，并行對所述至少一個圖形元素組中的每一者進行路徑繪制與渲染；以及按照所述圖形元素的層疊值升序的方式，將已被渲染的所述多個圖形元素集合繪制在第二渲染器中。

優選地，所述為所述每個圖形元素集合創建相應的第一渲染器包括：檢測繪圖渲染環境；以及根據所檢測的所述繪圖環境，為所述每個圖形元素集合創建相應的第一渲染器。

優選地，所述根據所檢測的所述繪圖環境，為所述每個圖形元素集合創建相應的第一渲染器包括：在所檢測的所述繪圖環境支持離屏渲染器的情況下，為所述每個圖形元素集合創建相應的離屏渲染器；在所檢測的所述繪圖環境支持位圖渲染器的情況下，為所述每個圖形元素集合創建相應的位圖渲染器；或者在所檢測的所述繪圖環境不支持離屏渲染器或位圖渲染器的情況下，為所述每個圖形元素集合創建相應的2D畫布。

優選地，所述并行對所述至少一個圖形元素組中的每一者進行路徑繪制與渲染包括：針對所述每個圖形元素集合，采用所述相應的第一渲染器執行以下操作：并行對所述至少一個圖形元素組中的每一者進行路徑繪制；以及并行對所述至少一個圖形元素組中的每一者的已被繪制的路徑進行渲染。

優選地，在執行所述按照圖形元素的層疊值存儲多個圖形元素集合之前，所述圖像處理方法還包括：針對所述每個圖形元素集合，執行以下操作：創建所述多個圖形元素中的每個圖形元素；以及為所述每個圖形元素配置相應的標識。

優選地，在執行所述將已被渲染的所述多個圖形元素集合繪制在第二渲染器中之后，所述圖像處理方法還包括：在特定圖形元素集合發生更新的情況下，采用所述與所述特定圖形元素集合相對應的渲染器，并行對所述特定圖形元素集合中的至少一個圖形元素組中的每一者進行路徑繪制與渲染；以及清除所述第二渲染器中已繪制的所述多個圖形元素集合，并按照所述圖形元素的層疊值升序的方式，并將已被渲染的更新后的所述多個圖形元素集合繪制在第二渲染器中。

優選地，所述圖像處理方法還包括：在特定圖形元素集合中的圖形元素的數量發生變化的情況下，確定所述特定圖形元素集合發生更新。