[發明專利]一種抗鋸齒方法及終端

在審

• 申請號: 202110011737.3
• 申請日: 2021-01-06
• 公開（公告）號: CN114722319A
• 公開（公告）日: 2022-07-08
• 發明（設計）人: 劉德建;黃夢飛;郭玉湖;陳宏
• 申請（專利權）人: 福建天泉教育科技有限公司
• 主分類號: G06F16/957
• 分類號: G06F16/957;G06T1/20;G06T11/20
• 代理公司: 福州市博深專利事務所(普通合伙) 35214
• 代理人: 張明

本發明公開一種抗鋸齒方法及終端，包括：采用dom繪制直線；接收對所述直線的旋轉指令；根據所述旋轉指令旋轉所述直線，并通過瀏覽器調用GPU對所述旋轉后的直線進行高性能渲染；本發明通過瀏覽器調用GPU對所述旋轉后的直線進行高性能渲染，避免默認的初級渲染，所述高性能渲染可以對直線邊緣進行柔化，增強視覺效果，從而消除使用dom繪制的直線進行旋轉時出現的鋸齒現象，而且本發明所述技術方案，可以支持各種類型的瀏覽器，適用范圍廣，普適性高。

技術領域

本發明涉及圖像處理領域，特別是涉及一種抗鋸齒方法及終端。

背景技術

在基于CSS3的Web前端開發中，一般采用DOM(Document Object Model,文檔對象模型)中設置style屬性鍵值對“transform:rotate(xxdeg)”的方法繪制直線，當直線旋轉到非水平或垂直的位置，直線邊緣會產生嚴重的鋸齒現象。

目前采用在transform屬性中加入translateZ(0)來消除鋸齒現象，例如-webkit-transform:rotate(5deg)translateZ(0)，但這種方案往往在某些主流瀏覽器，例如常見的谷歌瀏覽器中并不奏效，特別是在該直線dom元素不是直接附加transform屬性，而是作為基于某個主dom元素的附屬絕對定位dom元素的情況下鋸齒現象尤為明顯，在主dom元素旋轉之后,附屬的直線dom元素幾乎百分之百會出現邊緣鋸齒現象。

發明內容

本發明所要解決的技術問題是：提供一種抗鋸齒方法及終端，消除使用dom繪制的直線進行旋轉時出現的鋸齒現象。

為了解決上述技術問題，本發明采用的一種技術方案為：

一種抗鋸齒方法，包括步驟：

采用dom繪制直線；

接收對所述直線的旋轉指令；

根據所述旋轉指令旋轉所述直線，并通過瀏覽器調用GPU對所述旋轉后的直線進行高性能渲染。

為了解決上述技術問題，本發明采用的另一種技術方案為：

一種抗鋸齒終端，包括存儲器、處理器及存儲在存儲器上并可在處理器上運行的計算機程序，所述處理器執行所述計算機程序時實現以下步驟：

采用dom繪制直線；

接收對所述直線的旋轉指令；

根據所述旋轉指令旋轉所述直線，并通過瀏覽器調用GPU對所述旋轉后的直線進行高性能渲染。

本發明的有益效果在于：通過瀏覽器調用GPU對旋轉后的直線進行高性能渲染，避免默認的初級渲染，所述高性能渲染可以對直線邊緣進行柔化，增強視覺效果，從而消除使用dom繪制的直線進行旋轉時出現的鋸齒現象，并且上述方法可以支持各種類型的瀏覽器，適用范圍廣，普適性高。

附圖說明

圖1為本發明實施例的一種抗鋸齒方法的步驟示意圖；

圖2為本發明實施例的一種抗鋸齒終端的結構示意圖；

圖3為本發明實施例中采用現有技術對旋轉后的直線進行抗鋸齒的效果圖；

圖4為本發明實施例中采用本發明所述技術方案對旋轉后的直線進行抗鋸齒的效果圖。

具體實施方式

為詳細說明本發明的技術內容、所實現目的及效果，以下結合實施方式并配合附圖予以說明。

請參照圖1，一種抗鋸齒方法，包括步驟：

采用dom繪制直線；

接收對所述直線的旋轉指令；