2012-07-12 32 views
3

我有在拉斐爾Paper.path()一個充滿純樸的質地:Raphael.js圖像填充不更新不斷

var fill = screen.path(Iso.topFacePath(top)).attr({ 
    fill: 'url(http://www.mydomain.com/mytexture.jpg)', 
}); 

的路徑可以由用戶通過拖放來改變。爲此,我使用Element.drag()來綁定處理程序。

現在我介紹的問題是,當調用onmove-handler函數時,將重新計算所討論的元素,並且必須再次繪製。顯然,這對raphael來說太「太」了,填充圖案會隨機消失(閃爍),並在一段時間後再次出現(最新的onend)。

我實際使用的代碼是有點太多,張貼在這裏,但我建了一個fiddle(即仍然是一個有點亂,所以裸與我)在這裏你可以看到發生了什麼(你可以拖動四邊形的上側)。

有沒有簡單的解決方法呢?

我習慣畫布比拉斐爾要多得多(實際上這是我第一次真正使用拉斐爾)所以也許我每次都在重繪所有東西的方法......很明顯是錯誤的嗎?

編輯:我剛剛發現,似乎與瀏覽器有關。 Chrome瀏覽器和Firefox將產生閃爍的地方,Safari似乎做的一切都很好。

回答

2

這似乎是緩存的問題(raphael.js不高速緩存中的位圖填充,並重新加載它的每一個變化),並通過this pull request on GitHub是(作爲固定的(對我來說)08/14/2012)仍在等待中。

由於make文件指向本地和/或不存在的文件,Raphael很難/不可能自行構建,但您可以手動連接所有內容,修改構建腳本或使用在the example中使用的修改後的構建得到修復。

讓我們希望它能找到未來版本的拉斐爾。

+0

非常感謝這個發現!我一直試圖找到一個修復天,現在使用你的示例鏈接修改後的腳本,一切都很好:) – Andrej 2012-08-22 11:52:26