HTML5畫布繪製線在標尺

請訪問下面的jsfiddle： - http://jsfiddle.net/mayanknimje87/GfaZ2/3/HTML5畫布繪製線在標尺

有一把尺子和鉛筆。直線時，我可以畫直線。但是，當我旋轉的比例，線的繪製將無法正常工作。另外，我想給用戶提供動畫，當用戶將鉛筆放在標尺上時（限制在標尺的上部而不是底部或中間），它開始繪製線條和動畫。防爆。如果用戶將鉛筆放在尺子標記15上，則它應該動畫並從15畫線到0。用戶也可以在鉛筆觸及標尺頂部而不是中間和底部時畫線。請幫助我。學習會很好。提前致謝。

來源

2011-12-07 Mayank Nimje

有一些我發現動畫使用css3-webkit-animation-timing-function：ease-in-out; 但不要如何使用它。 –

爲了將畫布像素繪製在這些圖像元素之上，您必須將畫布放在頂部。但是，畫布會吸收鼠標事件。

不過，我認爲你應該這樣做，然後在畫布上捕捉鼠標事件並處理拖動。

來源

2011-12-07 21:18:25

我也一樣，請你檢查一下jsfiddle。只有當直尺時，直線纔會被繪製在直尺上。當我旋轉標尺時，鉛筆不會畫線。 –

我看不到那種行爲。我看到畫布背後的圖像，我證實了在webkit檢查。我拖動鉛筆而不觸摸標尺。這條線是在統治者下畫的。我在Windows 7上使用Chrome 15.0.874.121 m。 –

但是，我確實看到如果首先旋轉標尺，然後拖動鉛筆不會產生一條線。我認爲這與您使用可拖動/可拖拽，我不熟悉。也許你應該嘗試處理mousemove中的鉛筆拖動，就像你處理標尺旋轉一樣。 –

HTML5畫布繪製線在標尺

回答

相關問題