PIXI js - Pixel Data is Zero











up vote
0
down vote

favorite












I'm currently working on a little game written in JS using Pixi.js(https://github.com/pixijs). One Problem has occured currently, I'm trying to implement pixel exact collision between shapes, while I was programing a little I noticed that all the pixel RBGA values of my images are just 0.
I searched on the web but for a while but the only reason for those Problems I could find was that the canvas was tainted because of CORS(Pixel RGB values are all zero).



But this can't be the reason in my case because I created the sprites myself, I'm not loading them from other (any) domains or something like that.



Could this be a problem with the images? How do I avoid that? I will append some code that works if I use other images (some images I downloaded for tests).



const app = new PIXI.Application({width: 500, height: 500});
document.body.appendChild(app.view);
PIXI.loader.add("sprites/test.png")
.load(() => {
let img = new PIXI.Sprite(PIXI.loader.resources["sprites/test.png"].texture);
app.stage.addChild(img);
console.log(app.renderer.extract.pixels(img));
});


Edit: I tried getting the RGBA values using a short Java Program btw, same problem. Every single value is zero.










share|improve this question
























  • Have you checked that you are loading the images from the same exact domain? For example www.example.com is different than example.com.
    – Alesana
    Nov 18 at 19:56












  • I don't load them from any domain if I understand your answer correctly.
    – EadH
    Nov 18 at 20:21










  • any other ideas?
    – EadH
    Nov 20 at 11:16















up vote
0
down vote

favorite












I'm currently working on a little game written in JS using Pixi.js(https://github.com/pixijs). One Problem has occured currently, I'm trying to implement pixel exact collision between shapes, while I was programing a little I noticed that all the pixel RBGA values of my images are just 0.
I searched on the web but for a while but the only reason for those Problems I could find was that the canvas was tainted because of CORS(Pixel RGB values are all zero).



But this can't be the reason in my case because I created the sprites myself, I'm not loading them from other (any) domains or something like that.



Could this be a problem with the images? How do I avoid that? I will append some code that works if I use other images (some images I downloaded for tests).



const app = new PIXI.Application({width: 500, height: 500});
document.body.appendChild(app.view);
PIXI.loader.add("sprites/test.png")
.load(() => {
let img = new PIXI.Sprite(PIXI.loader.resources["sprites/test.png"].texture);
app.stage.addChild(img);
console.log(app.renderer.extract.pixels(img));
});


Edit: I tried getting the RGBA values using a short Java Program btw, same problem. Every single value is zero.










share|improve this question
























  • Have you checked that you are loading the images from the same exact domain? For example www.example.com is different than example.com.
    – Alesana
    Nov 18 at 19:56












  • I don't load them from any domain if I understand your answer correctly.
    – EadH
    Nov 18 at 20:21










  • any other ideas?
    – EadH
    Nov 20 at 11:16













up vote
0
down vote

favorite









up vote
0
down vote

favorite











I'm currently working on a little game written in JS using Pixi.js(https://github.com/pixijs). One Problem has occured currently, I'm trying to implement pixel exact collision between shapes, while I was programing a little I noticed that all the pixel RBGA values of my images are just 0.
I searched on the web but for a while but the only reason for those Problems I could find was that the canvas was tainted because of CORS(Pixel RGB values are all zero).



But this can't be the reason in my case because I created the sprites myself, I'm not loading them from other (any) domains or something like that.



Could this be a problem with the images? How do I avoid that? I will append some code that works if I use other images (some images I downloaded for tests).



const app = new PIXI.Application({width: 500, height: 500});
document.body.appendChild(app.view);
PIXI.loader.add("sprites/test.png")
.load(() => {
let img = new PIXI.Sprite(PIXI.loader.resources["sprites/test.png"].texture);
app.stage.addChild(img);
console.log(app.renderer.extract.pixels(img));
});


Edit: I tried getting the RGBA values using a short Java Program btw, same problem. Every single value is zero.










share|improve this question















I'm currently working on a little game written in JS using Pixi.js(https://github.com/pixijs). One Problem has occured currently, I'm trying to implement pixel exact collision between shapes, while I was programing a little I noticed that all the pixel RBGA values of my images are just 0.
I searched on the web but for a while but the only reason for those Problems I could find was that the canvas was tainted because of CORS(Pixel RGB values are all zero).



But this can't be the reason in my case because I created the sprites myself, I'm not loading them from other (any) domains or something like that.



Could this be a problem with the images? How do I avoid that? I will append some code that works if I use other images (some images I downloaded for tests).



const app = new PIXI.Application({width: 500, height: 500});
document.body.appendChild(app.view);
PIXI.loader.add("sprites/test.png")
.load(() => {
let img = new PIXI.Sprite(PIXI.loader.resources["sprites/test.png"].texture);
app.stage.addChild(img);
console.log(app.renderer.extract.pixels(img));
});


Edit: I tried getting the RGBA values using a short Java Program btw, same problem. Every single value is zero.







html5-canvas pixi.js






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 18 at 20:21

























asked Nov 18 at 19:52









EadH

11




11












  • Have you checked that you are loading the images from the same exact domain? For example www.example.com is different than example.com.
    – Alesana
    Nov 18 at 19:56












  • I don't load them from any domain if I understand your answer correctly.
    – EadH
    Nov 18 at 20:21










  • any other ideas?
    – EadH
    Nov 20 at 11:16


















  • Have you checked that you are loading the images from the same exact domain? For example www.example.com is different than example.com.
    – Alesana
    Nov 18 at 19:56












  • I don't load them from any domain if I understand your answer correctly.
    – EadH
    Nov 18 at 20:21










  • any other ideas?
    – EadH
    Nov 20 at 11:16
















Have you checked that you are loading the images from the same exact domain? For example www.example.com is different than example.com.
– Alesana
Nov 18 at 19:56






Have you checked that you are loading the images from the same exact domain? For example www.example.com is different than example.com.
– Alesana
Nov 18 at 19:56














I don't load them from any domain if I understand your answer correctly.
– EadH
Nov 18 at 20:21




I don't load them from any domain if I understand your answer correctly.
– EadH
Nov 18 at 20:21












any other ideas?
– EadH
Nov 20 at 11:16




any other ideas?
– EadH
Nov 20 at 11:16

















active

oldest

votes











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














 

draft saved


draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53364844%2fpixi-js-pixel-data-is-zero%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown






























active

oldest

votes













active

oldest

votes









active

oldest

votes






active

oldest

votes
















 

draft saved


draft discarded



















































 


draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53364844%2fpixi-js-pixel-data-is-zero%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

Ottavio Pratesi

Tricia Helfer

15 giugno