Web頁面中向量圖形可視化編輯的方法
【專利摘要】本發(fā)明提供WEB頁面中向量圖形可視化編輯方法，需要分配、分割、生成、拖拽、計算、繪制六個具體動作，歸納為在向量圖形中選定控制點和為上述選定的控制點添加事件兩大主要步驟。本發(fā)明提供的WEB頁面中向量圖形可視化編輯方法解決了無法預知給定點的坐標究竟會產(chǎn)生何種效果的問題，通過復雜的運算，腳本語言可以即時確定一個向量圖形的所有控制點并通過合適的方式(例如一個黑點)在屏幕上顯示出來，并且動態(tài)地為這些黑點添加鼠標和鍵盤事件。在用戶按下、移動和釋放鼠標或按下按鍵時，腳本代碼會根據(jù)預定義的功能移動這些黑點，同時通過運算，重繪相關(guān)的向量圖形，達到“所見即所得”的效果。
【專利說明】WEB頁面中向量圖形可視化編輯的方法

【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及WEB頁面處理【技術(shù)領(lǐng)域】，具體涉及WEB頁面中向量圖形可視化編輯的方法。

【背景技術(shù)】
[0002]對WEB頁面中向量圖形的編輯是一個困難的問題，多數(shù)向量圖形的最終顯示效果是由一些特殊的點的位置確定的(例如，折線是由所有拐點的位置確定的，曲線是由起點、終點和兩個位于曲線外的中間控制點確定的)，而根據(jù)這些特殊點的位置最終確定向量圖形其他點的數(shù)據(jù)是一個復雜的計算過程。因此，雖然理論上通過確定這些點的位置就可以確定最終的圖形，但在實際中，由于數(shù)學運算過于復雜，導致無法準確確定其他點的坐標。比較有效的方法只能通過大量實驗來篩選合適的點的位置。這就導致向量圖形的編輯效率低下，速度慢。


【發(fā)明內(nèi)容】

[0003]針對現(xiàn)有技術(shù)WEB頁面向量圖形編輯效率低下的問題，本發(fā)明提供了一種WEB頁面中向量圖形可視化編輯的方法，解決了“WEB頁面中向量圖形可視化編輯”問題，達到“所見即所得”的效果。
[0004]本發(fā)明技術(shù)方案
[0005]WEB頁面中向量圖形可視化編輯的方法包括如下步驟:
[0006]1.在向量圖形中選定控制點，具體方法是:
[0007]⑴分配N個控制點于一向量圖形的邊緣，N為大于2的自然數(shù)；
[0008]⑵依據(jù)所述控制點將該向量圖形分割為N-2個三角向量圖形；
[0009]⑶選定上述控制點其中之一進行拖拽；
[0010]⑷計算具有被選定的控制點的三角向量圖形的一更新向量；
[0011](5)根據(jù)所計算的更新向量重新繪制所述三角向量圖形
[0012]2.為上述選定的控制點添加事件。
[0013]WEB頁面中向量圖形可視化編輯的方法還包括以下步驟:以可視化形式標識所述選定的控制點。
[0014]所述可視化形式為將選定的控制點顯示為在所述向量圖形中突出可見的黑點。
[0015]步驟2中所述添加的事件為鼠標事件和/或鍵盤事件。
[0016]本發(fā)明的技術(shù)效果:
[0017]本發(fā)明提供一種WEB頁面中向量圖形可視化編輯方法，需要分配、分割、生成、拖拽、計算、繪制六個具體動作，歸納為在向量圖形中選定控制點和為上述選定的控制點添加事件兩大主要步驟。
[0018]本發(fā)明提供的WEB頁面中向量圖形可視化編輯方法解決了無法預知給定點的坐標究竟會產(chǎn)生何種效果的問題，通過復雜的運算，腳本語言可以即時確定一個向量圖形的所有控制點并通過合適的方式(例如一個黑點)在屏幕上顯示出來，并且動態(tài)地為這些黑點添加鼠標和鍵盤事件。在用戶按下、移動和釋放鼠標或按下按鍵時，腳本代碼會根據(jù)預定義的功能移動這些黑點，同時通過運算，重繪相關(guān)的向量圖形，達到“所見即所得”的效果。

【專利附圖】

【附圖說明】
[0019]圖1是本發(fā)明WEB頁面中向量圖形可視化編輯方法示意圖。

【具體實施方式】
[0020]WEB頁面中向量圖形的編輯是一個困難的問題，雖然理論上通過確定這些點的位置就可以確定最終的圖形，但在實際中，由于數(shù)學運算過于復雜，導致無法預知給定點的坐標究竟會產(chǎn)生什么樣的效果。唯一的方法只能通過大量實驗來篩選合適的點的位置。本發(fā)明提供的WEB頁面中向量圖形可視化編輯方法解決了無法預知給定點的坐標究竟會產(chǎn)生何種效果的問題，通過復雜的運算，腳本語言可以即時確定一個向量圖形的所有控制點并通過合適的方式(例如一個黑點)在屏幕上顯示出來，并且動態(tài)地為這些黑點添加鼠標和鍵盤事件。在用戶按下、移動和釋放鼠標或按下按鍵時，腳本代碼會根據(jù)預定義的功能移動這些黑點，同時通過運算，重繪相關(guān)的向量圖形，達到“所見即所得”的效果。
[0021]以下結(jié)合附圖對本發(fā)明的實施例作進一步說明。
[0022]圖1是本發(fā)明WEB頁面中向量圖形可視化編輯方法示意圖。如圖1所示，實現(xiàn)本發(fā)明WEB頁面中向量圖形可視化編輯方法需要分配、分割、生成、拖拽、計算、繪制六個具體動作，歸納為在向量圖形中選定控制點和為上述選定的控制點添加事件兩大主要步驟，具體為
[0023]WEB頁面中向量圖形可視化編輯的方法包括如下步驟:
[0024]1.在向量圖形中選定控制點，具體方法是:
[0025]⑴分配N個控制點于一向量圖形的邊緣，N為大于2的自然數(shù)；
[0026]⑵依據(jù)所述控制點將該向量圖形分割為N-2個三角向量圖形；
[0027]⑶選定上述控制點其中之一進行拖拽；
[0028]⑷計算具有被選定的控制點的三角向量圖形的一更新向量；
[0029](5)根據(jù)所計算的更新向量重新繪制所述三角向量圖形
[0030]2.為上述選定的控制點添加事件。
[0031]WEB頁面中向量圖形可視化編輯的方法還包括以下步驟:以可視化形式標識所述選定的控制點。所述可視化形式為將選定的控制點顯示為在所述向量圖形中突出可見的黑點。步驟B中所述添加的事件為鼠標事件和/或鍵盤事件。
[0032]以上對本發(fā)明所提供的WEB頁面中向量圖形可視化編輯方法進行了詳細介紹。本文中應(yīng)用具體實施例對本發(fā)明的原理和實施方式進行了闡述，以上實施例的說明只是用于幫助理解本發(fā)明的方法及其核心思想；同時，對于本領(lǐng)域的技術(shù)人員，依據(jù)本發(fā)明的思想，在【具體實施方式】及應(yīng)用范圍上仍然可以對本發(fā)明創(chuàng)造進行修改或者等同替換；綜上所述，本說明書內(nèi)容不應(yīng)理解為對本發(fā)明的限制，一切不脫離本發(fā)明的精神和范圍的技術(shù)方案及其改進，其均涵蓋在本發(fā)明創(chuàng)造專利的保護范圍當中。
【權(quán)利要求】
1.WEB頁面中向量圖形可視化編輯的方法，其特征在于，包括如下步驟: 在向量圖形中選定控制點，具體方法是: ⑴分配N個控制點于一向量圖形的邊緣，N為大于2的自然數(shù)； ⑵依據(jù)所述控制點將該向量圖形分割為N-2個三角向量圖形； ⑶選定上述控制點其中之一進行拖拽； ⑷計算具有被選定的控制點的三角向量圖形的一更新向量； (5)根據(jù)所計算的更新向量重新繪制所述三角向量圖形 為上述選定的控制點添加事件。
2.根據(jù)權(quán)利要求1所述的WEB頁面中向量圖形可視化編輯的方法，其特征在于，WEB頁面中向量圖形可視化編輯的方法還包括以可視化形式標識所述選定的控制點。 所述可視化形式為將選定的控制點顯示為在所述向量圖形中突出可見的黑點。 步驟2中所述添加的事件為鼠標事件和/或鍵盤事件。
3.根據(jù)權(quán)利要求2所述的WEB頁面中向量圖形可視化編輯的方法，其特征在于，所述可視化形式為將選定的控制點顯示為在所述向量圖形中突出可見的黑點。
4.根據(jù)權(quán)利要求1-3之一所述的WEB頁面中向量圖形可視化編輯的方法，其特征在于步驟B中所述添加的事件為鼠標事件和/或鍵盤事件。
【文檔編號】G06T11/60GK104182233SQ201410420808
【公開日】2014年12月3日 申請日期:2014年8月25日 優(yōu)先權(quán)日:2013年12月19日
【發(fā)明者】施霞虹 申請人:南寧市磁匯科技有限公司