可拖動，在HTML5畫布分級圖像

Question

我與我打算在使用HTML5一個小項目。 到目前爲止，我已經成功地設置了一些小的功能有點演示，但它仍然缺乏所有必要的功能。我希望這裏的某個人可能有時間爲初學者騰出空間。

總之，這裏是我的演示： http://persturesson.com/demo/

現在，你可以看到，圖像（是的，它是一個圖像，而不是一個繪製的對象，圖像將在最終版本改變，因此不投入很多）可拖動。但我希望能夠像這樣動態調整圖像大小： http://simonsarris.com/project/canvasdemo/demo2.html

任何人有一個想法如何將這個演示的功能合併到我的？

所有輸入都理解，謝謝。

Answer 1

我寫的，你看

演示所以相關的drawImage看起來是這樣的：這是目標的x，y，寬度和高度

context . drawImage(image, dx, dy, dw, dh)

。這意味着，無論原始圖像的大小如何，您都可以在畫布上繪製更大或更小的圖像。在我的盒子例如更改寬度和高度fillRect，而不是在這裏，你應該只改變drawImage的dw和dh值。

等都爲dw,dh值的transform.js文件的第32行，而不是150,150，應該有一個保存（和修改）的寬度和高度相當於，就像在我的演示。

其他的一切（讓手柄的工作，等等）應該是大同小異的。

如果還有任何問題，讓我知道！