爲<canvas>映射多邊形的正確方法

Question

幾個小時後，我一直在對着互聯網猛擊我的頭，想出如何獲得座標來製作一個特定形狀的多邊形（跟蹤圍繞一張圖片）在HTML5 <canvas>中使用。

我需要一個工具，允許我跟蹤連接點的圖片以創建多邊形，能夠重新調整多邊形的大小並接收數組中的新固定座標作爲可用作精靈的可複製文本<canvas>

也就是說，我需要獲得同一個多邊形固定座標的幾個版本，這些座標已經統一縮小或縮小。

A「鏡面點」功能也將是有用的，但不是必需的（我生活中可以沒有完美的對稱= P）

我發現了一些方法，但每一個都有自己的問題，這兩個是最接近我VE得到：

HTML圖像映射工具(This one was the best) 它給了我，我需要的座標，但我無法找到一個讓我重新大小的多邊形，並獲得新的座標，而且，我不能」找到另一個工具，我可以把座標放進去，並吐出新的調整大小的座標。我會做出同樣的多邊形兩次，但以不同的大小（也可能有未對齊的點）

互動數學繪圖儀(geogebra was the best one) 這一次將是完美的，但我不能把它給我以可複製的方式進行座標。我將不得不單獨寫下每一個需要時間的座標。

所以，我的問題是，製作複雜的多邊形/幾何形狀並獲得座標的正確方法是什麼？我很確定它只是基本的幾何/代數，但是有沒有更多的程序更加面向編碼器，並且正在尋找我想要的？

我不禁覺得我會對此完全錯誤的方式..

大家不要笑，數學不是我的強項.. 並請原諒我，如果這是在錯誤的堆棧交換站點，我不知道還有什麼地方可以放置它。

非常感謝您提供任何幫助。

Answer 1

哦，男人，我感到羞怯。

我發現geogebra能夠執行所有我需要的功能（雖然真的模糊，在一些地區複雜）

，而不是刪除我的帖子，但是，我認爲這很重要，我離開這個這裏爲其他人找到，考慮到我沒有找到任何有關創建圖像映射和矢量圖形的多邊形座標<canvas>搜索小時結束。

我能夠使多邊形的座標列表通過使用下列程序（內geogebra：

1. 做一個多邊形（通過使用多邊形工具，將聚行工具（其中有在輸入框中沒有一點限制，但在多邊形不填）或Polygon[A,B,C,D]）

2. （如果你的多邊形被命名爲POLY1它應該是默認的），把{Vertex[poly1]}到輸入框的底部，使協調員名單在代數視圖中。

3. 去查看>電子表格（您也可以按CTRL + 轉變 + 小號）

4. 右鍵單擊您的新列表（這是綠色）中的座標列表，然後選擇「記錄到電子表格「然後單擊關閉（只需按esc也可以使用，或者，如果您有很多多邊形，該框對於您的屏幕來說太大，關閉按鈕位於該框的右側，因此將該框拖動到離開，直到你看到按鈕）

5. 去查看>重新計算所有對象（或按CTRL + [R）

6. 選擇/通過點擊（2日）錶行突出顯示在電子表格中所有的數字和複製並粘貼到Notepad ++或其他編碼的文本編輯器，並使用替代函數（CTRL + ^h）搜索\t（或TAB），並與,\t替換所有的比賽（這將格式化您的座標，用在你的代碼）

要鏡像您可以使用「反映了線對象」工具（左文本工具）（選擇一個節點，你要鏡像，然後選擇一個頂點線將其反映到X或Y）

節點

您可以重新大小使用該輸入基於規模的多邊形：Dilate[poly1, 2]（調整2到任何規模要重新大小它）（感謝您對GeoGebra論壇評爲mathmum數學嚮導！）

其他不起眼的信息從數學奇才命名茲比涅克和murkle在Geogebra論壇：

替代方法來創建一個多邊形 使用「保利行」的工具，它沒有點限制，但缺點是不能填充多邊形。它比第二個選項快得多，可以像多邊形一樣進行操作。

選項二：

Polygon[A,B,C,D] 

，或者，如果您正在編輯從只有座標現有（未分），你可以使用語法：

Polygon[(-5,4),(0,-12),(5,4)] 

這對大型多邊形至關重要，因爲交互式多邊形工具具有點限制。

移動多邊形嘗試像

Translate[poly1,(1,1)] 

（ 「1,1」 你要移動它的X和Y coords）使用

四捨五入，你可以做點像

list1={Vertex[poly1]} 
text1=list1+"" 

然後右鍵單擊text1，轉到對象屬性>文本>舍入> 0小數位。

除了轉換實際的多邊形外，還可以直接在列表中應用轉換，例如。

2*list1, list1+(1,1) 

我仍然不知道這是着手做2D多邊形向量在畫布或圖像的地圖使用的正確方法，但這是我迄今設想的最簡單的方法。

謝謝Joachim（和數學奇才）花時間回覆我的問題=）

Answer 2

說到縮放，畫布可以爲您縮放：http://www.w3schools.com/tags/canvas_scale.asp 這將縮放一切，包括筆畫寬度。

如果您需要縮放代碼中的實際座標，例如爲了節省筆畫寬度，這只是將每個x和y分別乘以相同因子的問題。你可以很容易地從你的渲染代碼做到這一點。

這兩種方法都會將點相對於原點縮放。如果您需要對其他中心進行縮放，則需要移動它們（添加/減去x和y），縮放原點，然後將它們移回相同的數量。