2013-07-11 3 views
5

Я использую основанную на WebGL фреймворк Pixi.js для игры, и я пытаюсь применить бикубический фильтр масштабирования. В этом случае производительность не важна.Применить бикубический скейлинг-фильтр к Pixi.js sprite

Здесь вы можете увидеть пример сделанный с помощью CSS:

Example

Пожалуйста, проверьте мой Chrome оптимизирован jsFiddle.

Этот код предназначен для линейного масштабируемого изображения:

var stage = new PIXI.Stage(0xFFFFFF, true); 
var bg = PIXI.Sprite.fromImage("image.png"); 
bg.scale.x = .125; 
bg.scale.y = .25; 
stage.addChild(bg); 

var renderer = PIXI.autoDetectRenderer(93, 79); 
document.body.appendChild(renderer.view); 
var textureHasLoaded = false; 
checkIfTextureHasLoaded(); 

function checkIfTextureHasLoaded(){ 
    if (bg.texture.baseTexture.hasLoaded){ 
     textureHasLoaded = true; 
     renderTexture(); 
    } 
    if (!textureHasLoaded){ 
     requestAnimFrame(checkIfTextureHasLoaded); 
    } 
} 

function renderTexture(){ 
    renderer.render(stage); 
} 

ответ

9

Для Pixi.js версии 3.0 и выше масштабирования по умолчанию может быть установлен путем изменения PIXI.SCALE_MODES.DEFAULT:

PIXI.SCALE_MODES.DEFAULT = PIXI.SCALE_MODES.NEAREST; 

Для версий Pixi.js 1.5.0 и выше константы были moved, а теперь масштабирование установлено как:

PIXI.scaleModes.DEFAULT = PIXI.scaleModes.NEAREST; 
2

Команда Pixi.js добавит возможность указать scaling filters в ближайшее время.

Edit:

Вы теперь в состоянии specify the default scale mode:

PIXI.Texture.SCALE_MODE.DEFAULT = PIXI.Texture.SCALE_MODE.NEAREST; 
+0

Это теперь 'PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST' или' texture.scaleMode = PIXI.SCALE_MODES.NEAREST' – zippycoder

Смежные вопросы