將矢量繪製到EaselJS中的位圖

Question

我正在研究一個EaselJS程序，它不斷繪製數千個矢量。不用說，在很短的時間之後，性能下降。要在Flash中解決這個問題，我會在矢量背後創建一個位圖，並定期將矢量繪製到該位圖並從顯示列表中移除它們。

我在EaselJS中做這件事情時遇到了麻煩，儘管它看起來像所有的東西都已經到位。我如何創建一個空的Bitmap（）並將它的內容繪製到它？

Answer 1

我想你可以把所有東西放在一個容器中並緩存它。

var vectorContainer=new Container; 
for (var i = 0;i<numVectors;i++){ 
    var vector=new Shape(); 
    //draw whatever vector you want to vector.graphics 
    vectorContainer.addChild(vector); 
} 
vectorContainer.cache(someX,someY,someW,someH); 

但是，獲取最新的未標記生成，因爲當前版本有一個錯誤，並沒有正確緩存容器。

Answer 2

我也一直在向vector中添加'snapToPixel = true'，因爲我讀過它應該可以幫助某些瀏覽器。因此，在上面的示例代碼中，我會在最後一行添加以下行，並將其放在緩存的最後一行。

vectorContainer.snapToPixel = true; 

看看這個demo of cache and snap to pixel settings看到一個活生生的例子。

在我設置的特定瀏覽器中，捕捉像素並不會真正改變性能，但在閱讀文檔時它看起來應該是這樣。