本申請涉及計(jì)算機(jī)技術(shù)領(lǐng)域，尤其涉及一種在canvas里實(shí)現(xiàn)svg格式的path圖形的處理方法及其裝置。

背景技術(shù)：

路徑(path)字符串是在可縮放矢量圖形(scalablevectorgraphics，簡稱svg)中常用的一個(gè)非常方便而且強(qiáng)大的用來描述任意圖形的字符串格式。path字符串中包含了很多的具體繪制圖形的過程指令，只需要設(shè)定少量的點(diǎn)，就可以創(chuàng)建平滑流暢的線條(比如曲線)。雖然使用polyline元素也能實(shí)現(xiàn)類似的效果，但是必須設(shè)置大量的點(diǎn)(點(diǎn)越密集，越接近連續(xù)，看起來越平滑流暢)，并且這種做法不能夠放大(放大后，點(diǎn)的離散更明顯)。

canvas是html5規(guī)范中的畫布元素，canvas本身只具有非常底層的繪圖命令，比如lineto(畫線)、arc(畫圓)等，其并沒有提供像svg那樣的原生path對(duì)象支持?，F(xiàn)有技術(shù)中，如需要檢測任意的鼠標(biāo)操作是否點(diǎn)擊了path圖形的區(qū)域，可以通過canvasapi或者像素檢測的方法實(shí)現(xiàn)。但是，上述方案都存在若干缺陷：

(1)canvas的ispointinpath()是一個(gè)非常重要的函數(shù)，其作用是判斷某一點(diǎn)是否是在某個(gè)路徑內(nèi)，其語法結(jié)構(gòu)為：context.ispointinpath(x,y)；其中，x和y表示一個(gè)點(diǎn)的坐標(biāo)。但是，ispointinpath只對(duì)當(dāng)前路徑有效，即受限于只支持檢測canvas中最后的path狀態(tài)；并且完全依賴canvas的上下文環(huán)境(context)，無法脫離canvas.context環(huán)境使用；

(2)像素檢測方法需要獨(dú)立開設(shè)一個(gè)canvas專門用來做像素檢測，造成內(nèi)存的浪費(fèi)。

此外，上述的canvasapi或者像素檢測的方法都無法檢測出path圖形的外接矩形范圍。

技術(shù)實(shí)現(xiàn)要素：

本申請的主要目的在于提供一種svg格式的path圖形的處理方法及其裝置，以克服現(xiàn)有技術(shù)中的上述問題。

根據(jù)本申請實(shí)施例還提供了一種svg格式的path圖形的處理方法，其包括：獲取svg格式的path字符串，根據(jù)所述path字符串中的移動(dòng)指令將所述path字符串分割為一個(gè)或多個(gè)path數(shù)組；將所述path數(shù)組解析為對(duì)應(yīng)的指令集合，所述指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息；將指令類型為繪制曲線的指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，并將該線段對(duì)應(yīng)的坐標(biāo)信息存儲(chǔ)為與該指令的第一坐標(biāo)信息對(duì)應(yīng)的第二坐標(biāo)信息；根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

其中，所述指令類型為繪制曲線指令包括：繪制三次方程式貝塞爾曲線指令、繪制二次方程式貝塞爾曲線指令、繪制橢圓圓弧指令。

其中，將指令類型為繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，包括：對(duì)于繪制三次方程式貝塞爾曲線指令或繪制二次方程式貝塞爾曲線指令，計(jì)算該指令對(duì)應(yīng)的曲線上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

其中，將指令類型為繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，包括：對(duì)于繪制橢圓圓弧指令，計(jì)算該指令對(duì)應(yīng)的橢圓圓弧上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)，如果所獲取的點(diǎn)的數(shù)量小于橢圓圓弧的弧度數(shù)值，則根據(jù)所獲取的點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，否則根據(jù)橢圓圓弧的弧度數(shù)值將曲線平均分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

其中，所述根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形，包括：遍歷所述指令集合，如果所述指令集合中的指令存在對(duì)應(yīng)的第二坐標(biāo)信息則獲取該第二坐標(biāo)信息，否則獲取該指令對(duì)應(yīng)的第一坐標(biāo)信息；在canvas中根據(jù)獲取的第一坐標(biāo)信息和第二坐標(biāo)信息連接繪制為path圖形。

其中，所述方法還包括：根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息計(jì)算所繪制的path圖形的外接矩形范圍。

其中，所述方法還包括：接收到點(diǎn)擊操作，判斷所述點(diǎn)擊操作對(duì)應(yīng)的坐標(biāo)信息是否在所述path圖形之上，若是則判定該點(diǎn)擊操作點(diǎn)中path圖形區(qū)域；否則繼續(xù)判斷所述path圖形是否有顏色填充，如果有則根據(jù)所述path圖形進(jìn)行非零環(huán)繞算法判斷該點(diǎn)擊操作是否點(diǎn)中path圖形區(qū)域。

根據(jù)本申請實(shí)施例還提供了一種svg格式的path圖形的處理裝置，其包括：獲取模塊，用于獲取svg格式的path字符串；拆分模塊，用于根據(jù)所述path字符串中的移動(dòng)指令將所述path字符串分割為一個(gè)或多個(gè)path數(shù)組；解析模塊，用于將所述path數(shù)組解析為對(duì)應(yīng)的指令集合，所述指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息；分割模塊，用于將指令類型為繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，并將該線段對(duì)應(yīng)的坐標(biāo)信息存儲(chǔ)為與該指令的第一坐標(biāo)信息對(duì)應(yīng)的第二坐標(biāo)信息；檢測圖形繪制模塊，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

其中，所述指令類型為繪制曲線指令包括：繪制三次方程式貝塞爾曲線指令、繪制二次方程式貝塞爾曲線指令、繪制橢圓圓弧指令。

其中，所述分割模塊包括：第一分割模塊，用于對(duì)于繪制三次方程式貝塞爾曲線指令或繪制二次方程式貝塞爾曲線指令，計(jì)算該指令對(duì)應(yīng)的曲線上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

其中，所述分割模塊包括：第二分割模塊，用于對(duì)于繪制橢圓圓弧指令，計(jì)算該指令對(duì)應(yīng)的橢圓圓弧上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)，如果所獲取的點(diǎn)的數(shù)量小于橢圓圓弧的弧度數(shù)值，則根據(jù)所獲取的點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，否則根據(jù)橢圓圓弧的弧度數(shù)值將曲線平均分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

其中，所述檢測圖形繪制模塊，還用于遍歷所述指令集合，如果所述指令集合中的指令存在對(duì)應(yīng)的第二坐標(biāo)信息則獲取該第二坐標(biāo)信息，否則獲取該指令對(duì)應(yīng)的第一坐標(biāo)信息；在canvas中根據(jù)獲取的第一坐標(biāo)信息和第二坐標(biāo)信息連接繪制為path圖形。

其中，所述裝置還包括：外接矩形計(jì)算模塊，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息計(jì)算所繪制的path圖形的外接矩形范圍。

其中，所述裝置還包括：點(diǎn)擊操作檢測模塊，用于接收到點(diǎn)擊操作，判斷所述點(diǎn)擊操作對(duì)應(yīng)的坐標(biāo)信息是否在所述path圖形之上，若是則判定該點(diǎn)擊操作點(diǎn)中path圖形區(qū)域；否則繼續(xù)判斷所述path圖形是否有顏色填充，如果有則根據(jù)所述path圖形進(jìn)行非零環(huán)繞算法判斷該點(diǎn)擊操作是否點(diǎn)中path圖形區(qū)域。

根據(jù)本申請實(shí)施例還提供了一種終端設(shè)備，其包括：存儲(chǔ)器，其配置為存儲(chǔ)程序；處理器，其與所述存儲(chǔ)器相耦接，配置為處理所述存儲(chǔ)器存儲(chǔ)的程序；其中，所述處理器進(jìn)一步包括：獲取模塊，用于獲取svg格式的path字符串；拆分模塊，用于根據(jù)所述path字符串中的移動(dòng)指令將所述path字符串分割為一個(gè)或多個(gè)path數(shù)組；解析模塊，用于將所述path數(shù)組解析為對(duì)應(yīng)的指令集合，所述指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息；分割模塊，用于將指令類型為繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，并將該線段對(duì)應(yīng)的坐標(biāo)信息存儲(chǔ)為與該指令的第一坐標(biāo)信息對(duì)應(yīng)的第二坐標(biāo)信息；檢測圖形繪制模塊，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

根據(jù)上述實(shí)施例，通過將path圖形中的曲線分割為折線并在canvas中重新繪制path圖形，能夠在不依賴任何上下文環(huán)境的情況下檢測鼠標(biāo)點(diǎn)擊操作是否點(diǎn)中該path圖形區(qū)域；并且能夠方便地計(jì)算出path圖形的外接矩形范圍。

附圖說明

此處所說明的附圖用來提供對(duì)本申請的進(jìn)一步理解，構(gòu)成本申請的一部分，本申請的示意性實(shí)施例及其說明用于解釋本申請，并不構(gòu)成對(duì)本申請的不當(dāng)限定。在附圖中：

圖1是根據(jù)本申請一個(gè)實(shí)施例的svg格式的path圖形的處理方法的流程圖；

圖2是根據(jù)本申請另一實(shí)施例的svg格式的path圖形的處理方法的流程圖；

圖3a至3c是根據(jù)本申請實(shí)施例的path圖形的示意圖；

圖4是根據(jù)本申請一個(gè)實(shí)施例的svg格式的path圖形的處理裝置的結(jié)構(gòu)框圖；

圖5是根據(jù)本申請另一實(shí)施例的svg格式的path圖形的處理裝置的結(jié)構(gòu)框圖；

圖6是根據(jù)本申請一個(gè)實(shí)施例的終端設(shè)備的結(jié)構(gòu)框圖；

圖7是根據(jù)本申請一個(gè)實(shí)施例的處理器的結(jié)構(gòu)框圖。

具體實(shí)施方式

為使本申請的目的、技術(shù)方案和優(yōu)點(diǎn)更加清楚，下面將結(jié)合本申請具體實(shí)施例及相應(yīng)的附圖對(duì)本申請技術(shù)方案進(jìn)行清楚、完整地描述。顯然，所描述的實(shí)施例僅是本申請一部分實(shí)施例，而不是全部的實(shí)施例?；诒旧暾堉械膶?shí)施例，本領(lǐng)域普通技術(shù)人員在沒有做出創(chuàng)造性勞動(dòng)前提下所獲得的所有其他實(shí)施例，都屬于本申請保護(hù)的范圍。

圖1是根據(jù)本申請一個(gè)實(shí)施例的svg格式的path圖形的處理方法的流程圖，如圖1所示，所述方法至少包括以下步驟：

步驟s102，獲取svg格式的path字符串，根據(jù)所述path字符串中的移動(dòng)指令將所述path字符串分割為一個(gè)或多個(gè)path數(shù)組；

在本申請實(shí)施例中，path字符串中包含了很多的具體繪制圖形的過程指令，根據(jù)path字符串中的移動(dòng)指令(m)將該path字符串分割為一個(gè)或多個(gè)path數(shù)組，其中每個(gè)path數(shù)組對(duì)應(yīng)為一個(gè)獨(dú)立的path圖形，該獨(dú)立的path圖形可以是直線、曲線、規(guī)則的或不規(guī)則的閉合圖形，本申請對(duì)此不進(jìn)行限制。

步驟s104，將所述path數(shù)組解析為對(duì)應(yīng)的指令集合，所述指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息。

步驟s106，將指令類型為繪制曲線的指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，并將該線段對(duì)應(yīng)的坐標(biāo)信息存儲(chǔ)為與該指令的第一坐標(biāo)信息對(duì)應(yīng)的第二坐標(biāo)信息。

在本申請實(shí)施例中，所述繪制曲線指令至少包括繪制以下曲線的指令：三次方程式貝塞爾曲線(c)、二次方程式貝塞爾曲線(q)、橢圓圓弧(a)等。

步驟s108，根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

具體地，遍歷所述指令集合，如果所述指令集合中的指令存在對(duì)應(yīng)的第二坐標(biāo)信息則獲取該第二坐標(biāo)信息，否則獲取該指令對(duì)應(yīng)的第一坐標(biāo)信息；然后根據(jù)獲取的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

根據(jù)上述實(shí)施例，通過將path圖形中的曲線分割為線段并在canvas中重新繪制path圖形，能夠在不依賴上下文環(huán)境的情況下檢測任意的鼠標(biāo)點(diǎn)擊操作是否點(diǎn)中該path圖形的區(qū)域；并且能夠方便地計(jì)算出path圖形的外接矩形范圍。

下面結(jié)合圖2詳細(xì)描述上述各處理的細(xì)節(jié)。圖2是根據(jù)本申請另一實(shí)施例的svg格式的path圖形的處理方法的流程圖，如圖2所示，所述方法至少包括以下步驟：

步驟s202，獲取svg格式的path字符串。例如，path字符串為：

varpath＝“m1010h100h150m10315l110215a3050001162.55162.45l172.55152.45a3050-4501215.1109.9l31510v60q350100350130c350230450130450230z”。

在上述的path字符串中包括多種path指令，其中：m表示移動(dòng)指令、l表示直線繪制指令、h表示水平直線繪制指令、v表示垂直直線繪制指令、c表示三次方程式貝塞爾曲線繪制指令、q表示二次方程式貝塞爾曲線繪制指令、a表示橢圓圓弧繪制指令、z表示關(guān)閉指令。上述的path指令僅為舉例說明，并不限制本申請的保護(hù)范圍。

參考圖3a，是上述path字符串在canvas中的繪制效果的示意圖。如圖3a所示，上述的path字符串所繪制的圖形中包括2個(gè)獨(dú)立的path圖形，即子路徑301和子路徑302，其中子路徑301表示的圖形為一直線，子路徑302表示的圖形為一不規(guī)則的閉合圖形。

步驟s204，分析path字符串，通過正則表達(dá)式將path字符串分割為一個(gè)或多個(gè)path數(shù)組。

具體地，根據(jù)所述path字符串中的移動(dòng)指令(m指令)將path字符串分割為一個(gè)或多個(gè)path數(shù)組，其中每個(gè)path數(shù)組對(duì)應(yīng)一個(gè)獨(dú)立的path圖形。如果path字符串表示一個(gè)獨(dú)立的path圖形，則將該字符串分割為一個(gè)字符串?dāng)?shù)組；如果path字符串表示多個(gè)獨(dú)立的path圖形，則將該字符串分割為多個(gè)字符串?dāng)?shù)組。

承上述例子，通過正則表達(dá)式將path字符串分割為path數(shù)組的集合：

步驟s206，分別將每個(gè)path數(shù)組解析為對(duì)應(yīng)的指令集合，指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息，存儲(chǔ)指令對(duì)應(yīng)的第一坐標(biāo)信息(points)。

承上述例子，將步驟s204中分割得到的每個(gè)path數(shù)組解析成對(duì)應(yīng)的指令集合：

通過上述實(shí)施例，將復(fù)雜的path字符串解析為canvas能夠識(shí)別的底層path指令集合，通過指定path對(duì)象可以在canvas上繪制任意的多邊形。

步驟s208，遍歷所有的指令，將a(橢圓圓弧)、c(三次貝塞爾曲線)、q(二次貝塞爾曲線)等繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，即將繪制曲線指令對(duì)應(yīng)的曲線分割為折線。

具體地，對(duì)于繪制三次方程式貝塞爾曲線指令或繪制二次方程式貝塞爾曲線指令，按照貝塞爾曲線的數(shù)學(xué)公式計(jì)算該指令對(duì)應(yīng)的曲線上的每個(gè)像素點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔(例如5個(gè)像素)獲取該曲線上的像素點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息(_points)。

對(duì)于繪制橢圓圓弧指令，按照橢圓圓弧的數(shù)學(xué)公式計(jì)算該指令對(duì)應(yīng)的橢圓圓弧上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔(例如5個(gè)像素)獲取該曲線上的像素點(diǎn)，如果所獲取的像素點(diǎn)的數(shù)量小于橢圓圓弧的弧度數(shù)值，則根據(jù)所獲取的像素點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息(_points)；如果所獲取的像素點(diǎn)的數(shù)量大于或等于橢圓圓弧的弧度數(shù)值，則根據(jù)橢圓圓弧的弧度數(shù)值將曲線平均分割為一個(gè)或多個(gè)線段，同樣獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息(_points)。

如圖3b所示，303所示的點(diǎn)為繪制橢圓圓弧指令的分割點(diǎn)，304所示的點(diǎn)為繪制二次方程式貝塞爾曲線指令的分割點(diǎn)，305所示的點(diǎn)為繪制三次方程式貝塞爾曲線指令的分割點(diǎn)。

步驟s210，遍歷所有的指令，根據(jù)所有指令對(duì)象對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息連接繪制為一不規(guī)則多邊形(path圖形)。也就是說，若指令存在對(duì)應(yīng)的第二坐標(biāo)信息則取第二坐標(biāo)，否則取第一坐標(biāo)。具體地，對(duì)于繪制三次方程式貝塞爾曲線指令、繪制二次方程式貝塞爾曲線指令或繪制橢圓圓弧指令，上述繪制曲線指令存在對(duì)應(yīng)的第二坐標(biāo)則獲取第二坐標(biāo)；而對(duì)于其他的繪制直線的指令只存在對(duì)應(yīng)的第一坐標(biāo)則獲取第一坐標(biāo)。依序獲取繪制曲線指令的第二坐標(biāo)信息以及繪制直線指令的第一坐標(biāo)信息進(jìn)行連接，在canvas中繪制path圖形。

通過上述實(shí)施例得到的path圖形，在不依賴上下文環(huán)境的情況下能夠檢測任意的鼠標(biāo)點(diǎn)擊操作是否點(diǎn)中該path圖形的區(qū)域；并且通過path圖形能夠方便地計(jì)算出path圖形的外接矩形范圍。

步驟s212，根據(jù)path圖形上的每個(gè)點(diǎn)的坐標(biāo)數(shù)據(jù)，可以快速地計(jì)算出該圖形的外接矩形范圍(rectrange)。

具體地，參考圖3c，根據(jù)path圖形上每個(gè)點(diǎn)的坐標(biāo)數(shù)據(jù)確定path圖形的上、下、左、右等各邊界點(diǎn)的坐標(biāo)信息，然后將各邊界點(diǎn)連接起來就得到path圖形的外接矩形范圍。

步驟s214，根據(jù)path圖形進(jìn)行點(diǎn)擊操作檢測，具體地包括以下兩部分：

(1)接收到點(diǎn)擊操作后，首先判斷點(diǎn)擊操作對(duì)應(yīng)的坐標(biāo)信息是否在path圖形之上，若是則判定該點(diǎn)擊操作點(diǎn)中所述path圖形區(qū)域。

(2)如果點(diǎn)擊操作不在path圖形上，則繼續(xù)判斷圖形是否有fillstyle(顏色)填充，如果有填充，根據(jù)path圖形進(jìn)行非零環(huán)繞算法計(jì)算點(diǎn)擊操作是否在path圖形的面積內(nèi)，若是則判定該點(diǎn)擊操作點(diǎn)中所述path圖形區(qū)域。

在本申請的實(shí)施例中，指令對(duì)應(yīng)的第一坐標(biāo)信息為points，指令對(duì)應(yīng)的第二坐標(biāo)信息為_points，將points和_points存儲(chǔ)為path圖形的pointlist(坐標(biāo)數(shù)據(jù)表)屬性。當(dāng)繪制圖形時(shí)采用points，點(diǎn)擊檢測時(shí)用_points(如果有_points則取_points，否則取points)，在兼顧圖形繪制和點(diǎn)擊檢測的情況下有效實(shí)現(xiàn)了圖形繪制與點(diǎn)擊檢測的分離。

圖4是根據(jù)本申請一個(gè)實(shí)施例的svg格式的path圖形的處理裝置的結(jié)構(gòu)框圖，如圖4所示，所述處理裝置包括：

獲取模塊41，用于獲取svg格式的path字符串；

拆分模塊42，用于根據(jù)所述path字符串中的移動(dòng)指令將所述path字符串分割為一個(gè)或多個(gè)path數(shù)組；

解析模塊43，用于將所述path數(shù)組解析為對(duì)應(yīng)的指令集合，所述指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息。

分割模塊44，用于將指令類型為繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，并將該線段對(duì)應(yīng)的坐標(biāo)信息存儲(chǔ)為與該指令的第一坐標(biāo)信息對(duì)應(yīng)的第二坐標(biāo)信息。

其中，所述指令類型為繪制曲線的指令包括：繪制三次方程式貝塞爾曲線指令、繪制二次方程式貝塞爾曲線指令、繪制橢圓圓弧指令。

進(jìn)一步，所述分割模塊44包括：

第一分割模塊(未示出)，用于對(duì)于繪制三次方程式貝塞爾曲線指令或繪制二次方程式貝塞爾曲線指令，計(jì)算該指令對(duì)應(yīng)的曲線上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

第二分割模塊(未示出)，用于對(duì)于繪制橢圓圓弧指令，計(jì)算該指令對(duì)應(yīng)的橢圓圓弧上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)，如果所獲取的點(diǎn)的數(shù)量小于橢圓圓弧的弧度數(shù)值，則根據(jù)所獲取的點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，否則根據(jù)橢圓圓弧的弧度數(shù)值將曲線平均分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

檢測圖形繪制模塊45，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

進(jìn)一步地，所述檢測圖形繪制模塊45，還用于遍歷所述指令集合，如果所述指令集合中的指令存在對(duì)應(yīng)的第二坐標(biāo)信息則獲取該第二坐標(biāo)信息，否則獲取該指令對(duì)應(yīng)的第一坐標(biāo)信息；在canvas中根據(jù)獲取的第一坐標(biāo)信息和第二坐標(biāo)信息連接繪制為path圖形。

圖5是根據(jù)本申請另一實(shí)施例的svg格式的path圖形的處理裝置的結(jié)構(gòu)框圖。在圖4的基礎(chǔ)上，所述svg格式的path圖形的處理裝置還包括有：

外接矩形計(jì)算模塊51，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息計(jì)算所繪制的path圖形的外接矩形范圍。

點(diǎn)擊操作檢測模塊52，用于接收到點(diǎn)擊操作，判斷所述點(diǎn)擊操作對(duì)應(yīng)的坐標(biāo)信息是否在所述path圖形之上，若是則判定該點(diǎn)擊操作點(diǎn)中path圖形區(qū)域；否則繼續(xù)判斷所述path圖形是否有顏色填充，如果有則根據(jù)所述path圖形進(jìn)行非零環(huán)繞算法判斷該點(diǎn)擊操作是否點(diǎn)中path圖形區(qū)域。

以上描述了svg格式的path圖形的處理裝置的內(nèi)部功能和結(jié)構(gòu)。實(shí)際中，該處理裝置可實(shí)現(xiàn)為終端設(shè)備，如圖6所示，該終端設(shè)備60包括：存儲(chǔ)器61以及處理器62。

存儲(chǔ)器61配置為存儲(chǔ)程序。

另外，存儲(chǔ)器61，還可被配置為存儲(chǔ)其它各種數(shù)據(jù)以支持在終端設(shè)備上的操作。這些數(shù)據(jù)的示例包括用于在終端設(shè)備上操作的任何應(yīng)用程序或方法的指令、聯(lián)系人數(shù)據(jù)、電話簿數(shù)據(jù)、消息、圖片、音視頻等。

在實(shí)際應(yīng)用中，存儲(chǔ)器61可以由任何類型的易失性或非易失性存儲(chǔ)設(shè)備或者它們的組合實(shí)現(xiàn)，例如：靜態(tài)隨機(jī)存取存儲(chǔ)器(sram)、電可擦除可編程只讀存儲(chǔ)器(eeprom)、可擦除可編程只讀存儲(chǔ)器(eprom)、可編程只讀存儲(chǔ)器(prom)、只讀存儲(chǔ)器(rom)、磁存儲(chǔ)器、快閃存儲(chǔ)器、磁盤或光盤等。

處理器62與所述存儲(chǔ)器61相耦接，配置為處理所述存儲(chǔ)器存儲(chǔ)的程序。參考圖7，所述處理器62進(jìn)一步包括：

獲取模塊71，用于獲取svg格式的path字符串；

拆分模塊72，用于根據(jù)所述path字符串中的移動(dòng)指令將所述path字符串分割為一個(gè)或多個(gè)path數(shù)組；

解析模塊73，用于將所述path數(shù)組解析為對(duì)應(yīng)的指令集合，所述指令集合中的每個(gè)指令包括：指令類型信息和第一坐標(biāo)信息；

分割模塊74，用于將指令類型為繪制曲線指令對(duì)應(yīng)的曲線分割為一個(gè)或多個(gè)線段，計(jì)算每一線段對(duì)應(yīng)的坐標(biāo)信息，并將該線段對(duì)應(yīng)的坐標(biāo)信息存儲(chǔ)為與該指令的第一坐標(biāo)信息對(duì)應(yīng)的第二坐標(biāo)信息；

檢測圖形繪制模塊75，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息繪制path圖形。

所述指令類型為繪制曲線指令包括：繪制三次方程式貝塞爾曲線指令、繪制二次方程式貝塞爾曲線指令、繪制橢圓圓弧指令。

進(jìn)一步地，所述分割模塊74包括：

第一分割模塊(未示出)，用于對(duì)于繪制三次方程式貝塞爾曲線指令或繪制二次方程式貝塞爾曲線指令，計(jì)算該指令對(duì)應(yīng)的曲線上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)作為分割點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息；及

第二分割模塊(未示出)，用于對(duì)于繪制橢圓圓弧指令，計(jì)算該指令對(duì)應(yīng)的橢圓圓弧上的每個(gè)點(diǎn)的坐標(biāo)信息，按照預(yù)定像素間隔獲取該曲線上的點(diǎn)，如果所獲取的點(diǎn)的數(shù)量小于橢圓圓弧的弧度數(shù)值，則根據(jù)所獲取的點(diǎn)將曲線分割為一個(gè)或多個(gè)線段，否則根據(jù)橢圓圓弧的弧度數(shù)值將曲線平均分割為一個(gè)或多個(gè)線段，并獲取分割點(diǎn)的坐標(biāo)信息作為該指令的第二坐標(biāo)信息。

更進(jìn)一步，所述檢測圖形繪制模塊75還用于遍歷所述指令集合，如果所述指令集合中的指令存在對(duì)應(yīng)的第二坐標(biāo)信息則獲取該第二坐標(biāo)信息，否則獲取該指令對(duì)應(yīng)的第一坐標(biāo)信息；在canvas中根據(jù)獲取的第一坐標(biāo)信息和第二坐標(biāo)信息連接繪制為path圖形。

繼續(xù)參考圖7，所述處理器62還包括有：

外接矩形計(jì)算模塊76，用于根據(jù)所述指令集合中的指令所對(duì)應(yīng)的第一坐標(biāo)信息或第二坐標(biāo)信息計(jì)算所繪制的path圖形的外接矩形范圍。

點(diǎn)擊操作檢測模塊77，用于接收到點(diǎn)擊操作，判斷所述點(diǎn)擊操作對(duì)應(yīng)的坐標(biāo)信息是否在所述path圖形之上，若是則判定該點(diǎn)擊操作點(diǎn)中path圖形區(qū)域；否則繼續(xù)判斷所述path圖形是否有顏色填充，如果有則根據(jù)所述path圖形進(jìn)行非零環(huán)繞算法判斷該點(diǎn)擊操作是否點(diǎn)中path圖形區(qū)域。

繼續(xù)參考圖6，所述終端設(shè)備60還包括：通信組件63、電源組件64、音頻組件65、顯示器66等其它組件。需要說明，在圖6中僅示意性給出部分組件，并不意味著服務(wù)端設(shè)備僅包括圖中所示組件。

通信組件63被配置為便于終端設(shè)備和其他設(shè)備之間有線或無線方式的通信。終端設(shè)備可以接入基于通信標(biāo)準(zhǔn)的無線網(wǎng)絡(luò)，如wifi，2g或3g，或它們的組合。在一個(gè)示例性實(shí)施例中，通信組件63經(jīng)由廣播信道接收來自外部廣播管理系統(tǒng)的廣播信號(hào)或廣播相關(guān)信息。在一個(gè)示例性實(shí)施例中，通信組件63還包括近場通信(nfc)模塊，以促進(jìn)短程通信。例如，在nfc模塊可基于射頻識(shí)別(rfid)技術(shù)，紅外數(shù)據(jù)協(xié)會(huì)(irda)技術(shù)，超寬帶(uwb)技術(shù)，藍(lán)牙(bt)技術(shù)和其他技術(shù)來實(shí)現(xiàn)。

電源組件64，為服務(wù)端設(shè)備的各種組件提供電力。電源組件64可以包括電源管理系統(tǒng)，一個(gè)或多個(gè)電源，及其他與為服務(wù)端設(shè)備生成、管理和分配電力相關(guān)聯(lián)的組件。

音頻組件65被配置為輸出和/或輸入音頻信號(hào)。例如，音頻組件65包括一個(gè)麥克風(fēng)(mic)，當(dāng)服務(wù)端設(shè)備處于操作模式，如呼叫模式、記錄模式和語音識(shí)別模式時(shí)，麥克風(fēng)被配置為接收外部音頻信號(hào)。所接收的音頻信號(hào)可以被進(jìn)一步存儲(chǔ)在存儲(chǔ)器61或經(jīng)由通信組件63發(fā)送。在一些實(shí)施例中，音頻組件65還包括一個(gè)揚(yáng)聲器，用于輸出音頻信號(hào)。

顯示器2006包括屏幕，其屏幕可以包括液晶顯示器(lcd)和觸摸面板(tp)。如果屏幕包括觸摸面板，屏幕可以被實(shí)現(xiàn)為觸摸屏，以接收來自用戶的輸入信號(hào)。觸摸面板包括一個(gè)或多個(gè)觸摸傳感器以感測觸摸、滑動(dòng)和觸摸面板上的手勢。觸摸傳感器可以不僅感測觸摸或滑動(dòng)動(dòng)作的邊界，而且還檢測與觸摸或滑動(dòng)操作相關(guān)的持續(xù)時(shí)間和壓力。

本申請的方法的操作步驟與裝置的結(jié)構(gòu)特征對(duì)應(yīng)，可以相互參照，不再一一贅述。

綜上所述，根據(jù)本申請的上述技術(shù)方案，通過將path圖形中的曲線分割為折線并在canvas中重新繪制path圖形，能夠在不依賴任何上下文環(huán)境的情況下檢測鼠標(biāo)點(diǎn)擊操作是否點(diǎn)中該path圖形的區(qū)域；并且能夠方便地計(jì)算出path圖形的外接矩形范圍。

本領(lǐng)域技術(shù)人員應(yīng)明白，本申請的實(shí)施例可提供為方法、系統(tǒng)或計(jì)算機(jī)程序產(chǎn)品。因此，本申請可采用完全硬件實(shí)施例、完全軟件實(shí)施例或結(jié)合軟件和硬件方面的實(shí)施例的形式。而且，本申請可采用在一個(gè)或多個(gè)其中包含有計(jì)算機(jī)可用程序代碼的計(jì)算機(jī)可用存儲(chǔ)介質(zhì)(包括但不限于磁盤存儲(chǔ)器、cd-rom、光學(xué)存儲(chǔ)器等)上實(shí)施的計(jì)算機(jī)程序產(chǎn)品的形式。

在一個(gè)典型的配置中，計(jì)算設(shè)備包括一個(gè)或多個(gè)處理器(cpu)、輸入/輸出接口、網(wǎng)絡(luò)接口和內(nèi)存。

內(nèi)存可能包括計(jì)算機(jī)可讀介質(zhì)中的非永久性存儲(chǔ)器，隨機(jī)存取存儲(chǔ)器(ram)和/或非易失性內(nèi)存等形式，如只讀存儲(chǔ)器(rom)或閃存(flashram)。內(nèi)存是計(jì)算機(jī)可讀介質(zhì)的示例。

計(jì)算機(jī)可讀介質(zhì)包括永久性和非永久性、可移動(dòng)和非可移動(dòng)媒體可以由任何方法或技術(shù)來實(shí)現(xiàn)信息存儲(chǔ)。信息可以是計(jì)算機(jī)可讀指令、數(shù)據(jù)結(jié)構(gòu)、程序的模塊或其他數(shù)據(jù)。計(jì)算機(jī)的存儲(chǔ)介質(zhì)的例子包括，但不限于相變內(nèi)存(pram)、靜態(tài)隨機(jī)存取存儲(chǔ)器(sram)、動(dòng)態(tài)隨機(jī)存取存儲(chǔ)器(dram)、其他類型的隨機(jī)存取存儲(chǔ)器(ram)、只讀存儲(chǔ)器(rom)、電可擦除可編程只讀存儲(chǔ)器(eeprom)、快閃記憶體或其他內(nèi)存技術(shù)、只讀光盤只讀存儲(chǔ)器(cd-rom)、數(shù)字多功能光盤(dvd)或其他光學(xué)存儲(chǔ)、磁盒式磁帶，磁帶磁磁盤存儲(chǔ)或其他磁性存儲(chǔ)設(shè)備或任何其他非傳輸介質(zhì)，可用于存儲(chǔ)可以被計(jì)算設(shè)備訪問的信息。按照本文中的界定，計(jì)算機(jī)可讀介質(zhì)不包括暫存電腦可讀媒體(transitorymedia)，如調(diào)制的數(shù)據(jù)信號(hào)和載波。

還需要說明的是，術(shù)語“包括”、“包含”或者其任何其他變體意在涵蓋非排他性的包含，從而使得包括一系列要素的過程、方法、商品或者設(shè)備不僅包括那些要素，而且還包括沒有明確列出的其他要素，或者是還包括為這種過程、方法、商品或者設(shè)備所固有的要素。在沒有更多限制的情況下，由語句“包括一個(gè)……”限定的要素，并不排除在包括所述要素的過程、方法、商品或者設(shè)備中還存在另外的相同要素。

以上所述僅為本申請的實(shí)施例而已，并不用于限制本申請。對(duì)于本領(lǐng)域技術(shù)人員來說，本申請可以有各種更改和變化。凡在本申請的精神和原理之內(nèi)所作的任何修改、等同替換、改進(jìn)等，均應(yīng)包含在本申請的權(quán)利要求范圍之內(nèi)。