createjs位圖圖像旋轉使圖像參差不齊chrome

當我嘗試使用createjs旋轉位圖圖像（不調整大小，但只是旋轉）時，位圖圖像在Chrome中變得鋸齒狀。在Firefox中，它很好。createjs位圖圖像旋轉使圖像參差不齊chrome

這裏是我的代碼：

var backCard = new createjs.Bitmap(assetsLoader.getResult("back")); 
backCard.rotation = 24; 
stage.addChild(backCard); 
stage.update();

關於如何解決此問題的任何想法？

來源

2014-10-31 Deyan Vitanov

對我來說，在Firefox上，位圖變得鋸齒狀，在Chrome瀏覽器和Safari瀏覽器中得到反鋸齒。但我更喜歡它在Firefox上的外觀... – 2014-10-31 22:11:58

，我不知道，如果你想防止或Chrome啓用抗鋸齒，因爲我讓Chrome旋轉位圖抗鋸齒和Firefox沒有，所以我就講兩件事...

啓用抗鋸齒

沒有辦法做到這一點原生的，但你可以創建一個解決方法，如果你真的想強制抗鋸齒：添加一個模糊過濾器真正少量旋轉圖像。但請記住，模糊是一個非常昂貴的過濾器，您應該避免使用，但如果您使用它，則需要在應用過濾器後緩存位圖以減少CPU使用量。

backCard.filters = [new createjs.BlurFilter(2, 2, 1);]; // 2 is blur radius, 1 is blur quality. More quality means more expensive blur. 
var bounds = backCard.getBounds(); 
backCard.cache(bounds.x, bounds.y, bounds.width, bounds.height);

防止抗鋸齒

我覺得沒有這樣做但過的方式，但你可以使用next version of EaselJS它允許你定義如果對象將反鋸齒爲舞臺，因爲WebGL。請注意，如果WebGL在用戶的瀏覽器上不受支持，EaselJS將回退到HTML5 Canvas，該HTML5仍將具有抗鋸齒功能。

來源

2014-10-31 22:28:34

謝謝，但blince它eather使它非常模糊..看起來不好的BlurFilter（2,2,1）或使它無異BlurFilter（1,1,1） – 2014-11-01 11:56:18

在Safari ，這段代碼創建了一個很好的抗鋸齒：'new createjs.BlurFilter（1，1，2）'。請注意質量設置爲2，導致更昂貴的計算。我建議您將抗鋸齒功能留給瀏覽器，而不是嘗試解決不在代碼中的問題。 – 2014-11-01 13:16:30

此外，我無法在Chrome上測試此功能，因爲我正在使用我的項目來測試模糊效果，並且我不知道爲什麼，濾鏡不會顯示在Chrome上... – 2014-11-01 13:18:24

createjs位圖圖像旋轉使圖像參差不齊chrome

回答

相關問題