2013-12-13 75 views
0

這是我的jsfiddle:從畫布上刪除元素

http://jsfiddle.net/alonshmiel/c4upM/45/

,我有兩件事情,我需要在爲了做到完成任務:

1)用戶點擊時小的灰色圓圈,從小的淺藍色圓圈中移除線條。

我想在此代碼做:

// hide the line of the small light blue circle 
var c=document.getElementById(canvas_id); 
var ctx=c.getContext("2d"); 
ctx.clearRect(c.getAttribute('cx')-1,c.getAttribute('cy')-95,2,40); 

它的工作原理,但不完全(在clearRect清除,我想清楚了小面積的部分)。

2)當用戶點擊小的淺藍色圓圈時,從小灰圈中刪除該行。

任何幫助表示讚賞!

謝謝您的閱讀!

+1

更容易,只是重繪所有內容,但省略了這一行;)這是因爲現有的行非常難以「拉出」,因爲瀏覽器自動應用了反鋸齒。 – markE

+0

我想過,但我認爲這不是有效的..我這樣做,非常感謝你!!!!!!!爲您的所有幫助! –

回答

2

如果我理解你的問題,你的意思是clearRect清除不要想清除的東西的一部分?特別是,我假設你的意思是圓圈下方的灰色圓弧在刪除該行後留下了一個僞影。

問題是您目前的「修理」不足。就像你必須重新繪製藍色的圓圈後,你也需要重新繪製你的弧線,因爲它的一部分被clearRect調用擦除。

一般來說,很難準確地告訴某些瀏覽器如何執行某些繪製例程。反鋸齒可能會打開或關閉(等),導致「修復」變得困難。一個更簡單的方法(並且首選,除非渲染能力是非常重要的),就是在點擊圓時清除整個背景,然後重新渲染所有內容,除了違規行。