Jump to content

PIXI.loader.add with image instead of json file


Recommended Posts

I have a couple of texture atlases. The order of textures that create animation is the same in all of them. In other words, my first frame of animation is always (0,0,100,100), my second frame is in all atlases (100,0,100,100) and so on. The only thing that changes is meta's image: "image1.png". It changes to "image3.png" and so on. Frames in all texture atlases are named the same


    "meta": {
        "image": "image1.png",
        "size": {"w"1000,"h":2000},
        "scale": "1"
    "frames": {
            "frame": {"x":0,"y":0,"w":100,"h":100},
            "rotated": false,
            "trimmed": false,
            "spriteSourceSize": {"x":0,"y":0,"w":100,"h":100},
            "sourceSize": {"w":100,"h":100}



It is kinda wasteful to load 10 different json files, because the positions and frame names are always the same for all of the animations. How can I load images instead of json files?



PIXI.loader .add(['assets/file1.json']); // don't wanna load 10 json files

function createFrames(name, imageToUse) {
    var frames = [];

    for (var i = 0; i < 30; i++) {
        var val = i < 10 ? '0' + i : i;
        frames.push(PIXI.Texture.fromFrame(name + val + '.png')); // use imageToUse to tell PIXI from which image should it create frames.
    return frames;


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...