Apply bicubic scaling filter to a Pixi.js sprite

Question

I am using the WebGL based framework Pixi.js for a game and I try to apply a bicubic scaling filter. The performance isn't important in this case.

Here you can see an example made with CSS:

Please check my Chrome optimized jsFiddle.

This code is for a linear scaled image:

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);   
}

Answer 1

For Pixi.js versions 3.0 and above default scaling can be set by changing PIXI.SCALE_MODES.DEFAULT:

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

For Pixi.js versions 1.5.0 and above the constants have been moved and scaling is now set as:

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

Answer 2

The Pixi.js team will add the possibility to specify scaling filters soon.

Edit:

You are now able to specify the default scale mode:

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