畫成畫布形狀的圖像

Question

我在畫布上創建了一個形狀，並希望在其中繪製圖像。

到目前爲止，我可以將圖像剪切成形狀，但我希望圖像可以使用自由變形 - >扭曲效果或類似的東西來適應自己。

在該實例中：

• 左側的圖像是限幅之一。
• 右邊的圖片是原件。
• 底部圖像是我想要達到的結果。

的代碼可以在這裏看到：http://jsfiddle.net/NAe9c/

代碼的結果可以在這裏看到：http://www.tribalddb.pt/final.jpg

編輯：
謝謝大家
我接受了回答這個問題，但我發現另一個替代我的問題，CSS 3D。 我不知道到現在爲止= P

Answer 1

是的，你可以繪製事物的平面，並讓它們呈現透視。你不能簡單地用2D變換來完成，所以如果你想使用2D上下文，但是沒有什麼是瘋狂的，那麼對於這個考驗有一些數學問題。

我建議做了「帆布透視變換」，你會發現很多的演示中，像這樣的一個搜索：

http://tulrich.com/geekstuff/canvas/perspective.html

Answer 2

你需要的是這樣做透視修正，我認爲這將是更容易獲得庫爲你做它，已經使用考慮：

Three.js