Jump to content
This forum will be closing down. Please move to the respective dedicated project forums.

Loader add json manually without reference to file


AntoniaChimp
 Share

Recommended Posts

Hey !

I dont want a call from javascript to look for my "sprites.json", so I thought that I put the json within the js
and then tell the loader it should read from there. Like that:

let json = { ....... }

PIXI.loader
    .add(json)
    .load(setup);

But its not working that way. Can anyone help me ?

Link to comment
Share on other sites

20 minutes ago, jonforum said:

on my side am not understand what you asking can you elaborate, maybe i can help.

So I already investigate further.

I dont want to use the pixi loader for reasons.

I want to create the spritesheet myself so I can use base64 image.
So thats my current progress.

let sprite = PIXI.Sprite.fromImage(base64);

let spritesheet = new PIXI.Spritesheet(sprite.texture.baseTexture, spritesheetJSONdata);

It creates the spritesheet, but the textures are empty. 
In the json it says:
 

"meta": {
	"image": "sprites.png",
	"size": {"w": 2231, "h": 2234},
	"scale": "1"
}

Obviously "image": "sprites.png" is not working so I tried to either delete the image entry or replace it with the base64 image string. But that didnt change anything.
The textures of the spritesheet remains empty.

Link to comment
Share on other sites

2 minutes ago, jonforum said:

yes , if you don't want the pixi.loader , you will need create your textures manually 
Look para from PIXI.Texture

new PIXI.Texture(baseTexture frame, orig, trim, rot, base.data.frames[key].anchor);

so there is no chance to use PIXI.spritesheet at all ? or just the basetexture needs to be done manually ?

Link to comment
Share on other sites

hum well i think you need see with a pro of pixiloader, am not very know the api in deep.
But on my side here how i proceed to load my sprite Sheets with texturePacker.
Maybe you can found some answer here.
https://github.com/djmisterjon/PIXI.ProStageEditor/blob/31ad00f173f4d2c5ce99fd19711f687d09d84b45/js/core/loaders.js#L266

Any reason why you don't want use the loader ? it can do a lot of complexe stuff ! 

Link to comment
Share on other sites

1 minute ago, jonforum said:

hum well i think you need see with a pro of pixiloader, am not very know the api in deep.
But on my side here how i proceed to load my sprite Sheets with texturePacker.
Maybe you can found some answer here.
https://github.com/djmisterjon/PIXI.ProStageEditor/blob/31ad00f173f4d2c5ce99fd19711f687d09d84b45/js/core/loaders.js#L266

Any reason why you don't want use the loader ? it can do a lot of complexe stuff ! 

I just want to have a single html file. so images should be inline as well as json. So I cant use the loader with urls

Link to comment
Share on other sites


let spritesheet = new PIXI.Spritesheet(sprite.texture.baseTexture, spritesheetJSONdata);

It should work, you are doing something wrong. To determine whats wrong please give us more info. Do you know how to debug stuff, how to place breakpoints?

Also spritesheet parse is kinda async, you have to pass callback somewhere if you want more than 10000 frames or so.

Link to comment
Share on other sites

7 minutes ago, ivan.popelyshev said:


let spritesheet = new PIXI.Spritesheet(sprite.texture.baseTexture, spritesheetJSONdata);

It should work, you are doing something wrong. To determine whats wrong please give us more info.

What kind of info do you need ? 
Thats mostly everything I have.

  • An image base64 encoded
  • creating a sprite with fromImage to use its basetexture in the spritesheet
  • a sprite sheet json created from shoebox
  • not sure about the json meta part because it says "image": "sprites.png" and instead of that I put the base64 again

    so to be sure here is my json: 
     
    {
    "frames": {
    	"banner.png": {
    		"frame": {"x":0, "y":2089, "w":465, "h":144},
    		"spriteSourceSize": {"x":0,"y":7,"w":465,"h":158},
    		"sourceSize": {"w":465,"h":158}
    	},...
    },
    "meta": {
    	"image": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA.....",
    	"size": {"w": 2231, "h": 2234},
    	"scale": "1"
    }
    }

    and concerning the debug..
    Where should I do the debug ? in Pixi code ? because mine goes through without error its just that spritesheet.textures is empty.

    I have around 40 images, so I dont think parsing should be the problem.

Link to comment
Share on other sites

You are lucky! We are working on examples for playable ads. Unfortunately, they are not available yet. Wait a month or two.

Also "no one ever posted their code for the issue" is MY phrase, that's how I explain people why is feature X not available. Someone asks help, I provide a few snippets, they make their app and do not share the result. Then second person asks the same thing. Then third. On 10-th attempt we have a hero who makes an article or repository and shares it with community! :)

Link to comment
Share on other sites

18 hours ago, ivan.popelyshev said:

You are lucky! We are working on examples for playable ads. Unfortunately, they are not available yet. Wait a month or two.

Also "no one ever posted their code for the issue" is MY phrase, that's how I explain people why is feature X not available. Someone asks help, I provide a few snippets, they make their app and do not share the result. Then second person asks the same thing. Then third. On 10-th attempt we have a hero who makes an article or repository and shares it with community! :)

Damn it last time you said you are working on an example for playable ad, you said its gonna be done in 2-4 weeks. And that was 2 weeks ago :D Ok well here we go me trying to make the spritesheet work

UPDATE:
It works. Apparently you have to call spritesheet.parse(()=>{}) yourself, which I didnt know (Parse takes a callback).
And the meta data of the json, does not need any field for image. 

Link to comment
Share on other sites

  • 4 months later...

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.

Guest
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.

Loading...
 Share

  • Recently Browsing   0 members

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