PIXI js，精灵不显示，没有错误

Question

我有以下代码：

var viewWidth, viewHeight, renderer, stage, loader;
var rendererOptions = {
    transparent: true
};

function init () {
    viewWidth = window.innerWidth;
    viewHeight = window.innerHeight;
    renderer = PIXI.autoDetectRenderer(viewWidth, viewHeight, rendererOptions);
    renderer.view.className = "rendererView";

    // add to DOM
    document.body.appendChild(renderer.view);

    // create stage
    stage = new PIXI.Container();
    stage.width = viewWidth;
    stage.height = viewHeight;
    stage.alpha = 0;

    // load images
    loader = PIXI.loader;

    loader.add("images/bg.jpg");
    loader.once("complete", onAssetsLoaded);
    loader.load();
}

function onAssetsLoaded () {
    console.log("assets loaded");

    createElements();
    update();
}

function createElements () {
    console.log("create elements");
    var bg = new PIXI.Sprite.fromImage("images/bg.jpg");

    bg.position.x = 200;
    bg.position.y = 200;

    stage.addChild(bg);
}

function update () {
    render();
    requestAnimationFrame(update);
}

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

但是我的精灵没有出现。只是一片空白canvas。我检查了 chrome 中的网络选项卡，正在加载它。记录阶段，它有一个child；精灵，它有一个正确的 baseUrl 和一切。但它只是空白。我已经把它放在我的网络服务器上了。

我碰壁了。有谁知道这可能是什么？我使用的是最新版本的 Pixi，3.0。

谢谢！

Answer 1

我知道的不多，但我认为你必须将图像加载到纹理，然后再将其加载到精灵。

Answer 2

或者可能是 PIXI.loaders.Loader，而不是 PIXI.loader

Answer 3

解决了，是我的错。我没有意识到我已经将舞台的 alpha 设置为 0...

PIXI js，精灵不显示，没有错误

PIXI js, sprite not showing, no errors

javascript

image

pixi.js