# 監視器前台操作規格書

## *需求:希望形狀重頭到尾都用同一個，每按下0,1,2的按鈕都會是新的坐標跟圖形

### A1.按下第0顆按鈕後，圖片坐標跟線框變更，並出現最新坐標


### A2.按下第0顆按鈕後，圖片坐標跟線框變更，並出現目前坐標提示

### B1.按下第1顆按鈕後，圖片坐標跟線框變更，不延續按鈕0原本的形狀，並出現最新坐標


### C1.按下第2顆按鈕後，圖片坐標跟線框變更，不延續按鈕0原本的形狀，並出現最新坐標

### D1.圖形可以旋轉

### E1.問題癥結點 (已解決)
解答:1.points應該是個物件陣列的角色，numberOfItems是要取得points陣列內有多少個point，也就是座標。
解答:2.svgRoot.position看起來是取得html檔案內的id=svg這個標籤在畫面上的座標
解答:3.window.getComputedStyle 是BOM的語法，目的是要取得某個html標籤的CSS，在你的程式裡面是為了取得第49行動態建立的div標籤的預設css，然後再去修改他的css樣式（看起來是要改變他的top和left位置）

1.這個for迴圈這樣寫，我要產生新坐標製造新圖形，只能再copy這個function改名來用，但主管不希望這樣，太複雜。
2.當我要把draggable()方法分離出來，產生新坐標，無法切割。

檔案位置
https://github.com/docats/arrow.git
1.檔名:rect.html
2.檔名:rect.js

規格說明:
(1)瀏覽器最低需求: IE11 (chrome禁用)
(2)外掛可使用，但不能超過1MB
(3)採用JavaScript或Jquery寫皆可