網頁版幾何畫板開發筆記(十一) 角的標記

在幾何畫板中, 有一項功能是爲邊和角添加標記, 之前作過角標記(AngleMark)的處理, 但在更改程序的
時候不知道哪裏改動了, 使得功能出現了異常. 爲此, 寫下原來如何作的思路和筆記, 來幫助查找和解決
問題. 函數

爲產生一個角標記的鼠標操做過程爲:
  1. 選擇標記工具(MarkTool), 在角的頂點處按下鼠標(左鍵).
  2. 拖動鼠標(左鍵按下狀態), 到所需出現角標記的方向.
  3. 鬆開鼠標左鍵, 此時實際建立角標記. 工具

分別對應 MarkTool 工具的三個處理函數: mouse_down, mouse_move, mouse_up. oop

在 mouse_down() 中, 對鼠標點擊位置進行點擊測試, 若是點擊到一個點上面, 則
設置屬性 this.angle_pt 並返回. 這個就當作是角的頂點. 測試

在 mouse_move() 中, 若是有 this.angle_pt 屬性被設置(前提是左鍵被按下), 則使用
鼠標的位置向量 e.objX-this._down_x 計算 mouse_mark(false).
(回顧這裏的時候, 發現了bug, 這裏計算鼠標向量出錯了) this

在 mouse_up() 中, 若是有 this.angle_pt, 則也計算 mouse_mark(true), 與 mouse_move()
的區別是, 實際建立出 AngleMark. 下面說明函數 mouse_mark(). spa

函數 mouse_mark() 用於計算/建立點 this.angle_pt 在方向 (x0,y0) 的角標記. 步驟以下:
  1. 計算/找到全部過點 this.angle_pt 的射線(過該點的直線被當作兩個相反方向的射線看待).
     並按照射線與 x 軸的夾角大小排序.
  2. 查找向量 (x0,y0) 構成的角 β 在哪兩條射線之間. 則頂點 this.angle_pt 和這兩條射線
     構成要標記的角. (幾何畫板支持更好的選擇操做, 咱們暫時不實現了)
  3. 若是是鼠標移動階段, 則建立一個臨時的 AngleMark 對象. 並返回.
  4. 若是是鼠標彈起, 則建立最終的 AngleMark 對象, 可能還要建立 oopt. 對象

 這裏問題: 因爲每次 mouse_move() 都建立了臨時的 AngleMark, 致使繪製有點麻煩.
  TODO: 思考怎麼改進. 排序

臨時 AngleMark 和持久 AngleMark 都須要點, 由於一個 AngleMark 必須由三個點構成,
分別是頂點, 角左邊上的點, 角右邊上的點. 下面說明求取左右邊點的函數. bug

函數 edge_to_pt(e) 用於求出在邊 e 上面的一個點, 使得角頂點和該點構成邊. 程序

函數 foc_pt_on_edge(e) 用於查找或建立(find or create) 點在邊 e 上面. 因爲邊 e 上面可能沒有所須要的定位角的點, 此時則須要建立一個新的 oopt 在 e 上面. 當前 取像素 100 個長度做爲新的點的位置.

相關文章
相關標籤/搜索