[發明專利]高性能網頁實時繪畫互動方法及其系統

在審

• 申請號: 201910966432.0
• 申請日: 2019-10-12
• 公開（公告）號: CN110727896A
• 公開（公告）日: 2020-01-24
• 發明（設計）人: 徐璇;盧曉飛;張元元;蔡榮
• 申請（專利權）人: 杭州天寬科技有限公司
• 主分類號: G06F16/958
• 分類號: G06F16/958;G06T11/20;G06F9/451
• 代理公司: 33289 杭州裕陽聯合專利代理有限公司
• 代理人: 姚宇吉

1.一種高性能網頁實時繪畫互動方法，基于HTML5的畫布功能，其特征在于：

包括：

記錄繪畫命令，在每一個周期內形成圖形變化的命令數據；

對所有的命令數據按照記錄所產生的時間先后秩序規則進入通道；

由通道中讀取命令數據并刷新至畫布中。

2.根據權利要求1所述的高性能網頁實時繪畫互動方法，其特征在于，

所述記錄繪畫命令，在每一個周期內形成圖形變化的命令數據，包括：

設置繪畫命令記錄方法，記錄每個繪畫操作周期結束時的畫布存在圖形變化后的命令組，并以命名組為單位繪制出內存位圖。

3.根據權利要求2所述的高性能網頁實時繪畫互動方法，其特征在于，

所述對所有的命令數據按照記錄所產生的時間先后秩序規則進入通道包括：

創建一個內存位圖緩存區作為通道，將繪畫模塊所繪制的內存位圖按記錄產生的時間先后秩序規則存入該緩存區。

4.根據權利要求3所述的高性能網頁實時繪畫互動方法，其特征在于，

所述由通道中讀取命令數據并刷新至畫布中包括：

讀取緩存模塊中的內存位圖緩存區所緩存的內存位圖刷新顯示至畫布中。

5.一種高性能網頁實時繪畫互動系統，其特征在于，所述系統包括：

繪畫模塊，用于記錄繪畫命令，在每一個周期內形成圖形變化的命令數據；其中，命令數據包括記錄每個繪畫操作周期結束時的畫布存在圖形變化后的命令組，命令數據以命名組為單位的形式繪制出內存位圖，并發送至緩存模塊；

緩存模塊，用于按照記錄所產生的時間先后秩序規則存儲所有的內存位圖；

刷新模塊，用于讀取緩存模塊中的內存位圖緩存區所緩存的內存位圖刷新顯示至畫布中。

6.根據權利要求5所述的高性能網頁實時繪畫互動系統，其特征在于，

所述繪畫模塊中還包括：

多個繪畫記錄單元，每個所述繪畫記錄單元用于存儲繪畫命令記錄的方法。

7.根據權利要求6所述的高性能網頁實時繪畫互動系統，其特征在于，

所述繪畫操作周期由所有繪畫記錄單元的單次單個調用進行繪畫的周期長度形成。

8.根據權利要求7所述的高性能網頁實時繪畫互動系統，其特征在于，

所述刷新模塊讀取緩存模塊中的內存位圖緩存區所緩存的內存位圖并刷新顯示至畫布中，讀取時以先入先出的規則讀取。

9.根據權利要求8所述的高性能網頁實時繪畫互動系統，其特征在于，

每個畫布設置有唯一標識；在繪畫模塊中，在用戶每次調用封裝的各類繪畫記錄單元進行繪畫操作時，通過其繪畫記錄單元調用時的各項數據參數捕捉到畫布上圖形的像素點數據變化，用以計算出當用戶發生各種繪畫操作時，畫布中所繪畫的圖形的各個像素點的數據變化，得出一個像素數據組，其中包含了圖形中所有存在變化的像素點數據，然后結合畫布的唯一標識形成一個圖形變化數據組；

所述繪畫模塊將內存位圖和圖形變化數據組同時發送至緩存模塊。

10.根據權利要求9所述的高性能網頁實時繪畫互動系統，其特征在于，

所述緩存模塊還包括；

圖像變化數據緩存區，將監聽計算得出的每一個圖形變化數據組存入該緩存區，基于websocket技術使得所有客戶端與服務端形成持久的連接。