畫布中的動畫不起作用

我寫了一個簡單的代碼來獲取畫布的上下文並添加兩個Rectange對象以便將它們繪製到畫布上。我的問題是我無法爲它們設置動畫，因爲當我嘗試使用context.clearRect（）;它會拋出一個錯誤，指出上下文未定義。但有沒有其他方法，即使我不會工作的繪圖方法。我無法找出解決方案。我看到的錯誤是在Firebug控制檯上。我有我的小提琴代碼在畫布中的動畫不起作用

http://jsfiddle.net/shivkumarganesh/b8cKZ/

來源

2012-03-30 Shiv Kumar Ganesh

setTimeout(refresh, 1000);

的問題。你正在調用這個函數，但你沒有傳遞參數。由於您將必要變量聲明爲全局變量，因此也不需要refresh需要參數。

來源

2012-03-30 08:55:27 ZippyV

您可以編輯代碼，以便有一個動畫不要白白重新繪製的一切100倍？ PLS – 2012-03-30 09:24:01

drawObj.push(new Rectangle("20", "20", "30", "40", "#3A5BCD")); 
drawObj.push(new Rectangle("50", "50", "100", "30", "#EF2B36"));

您正在爲x，y，寬度和高度傳遞字符串。

objArray[i].width=objArray[i].width+j; 
objArray[i].height=objArray[i].height+j;

...所以這樣做字符串連接，這意味着寬度最終成爲一個字符串說：「3000000000000000000000」 ......

你應該學會使用Chrome的調試器（控制+ Shift + J）用它找到這樣的問題真的很容易。

還可以使用requestAnimationFrame而不是setTimeout和每幀:)

來源

2012-03-30 12:36:32 AshleysBrain

畫布中的動畫不起作用

回答

相關問題