mask on renderercanvas errror?

[rossi46]

I created a slot game. But in some browser does'n't support webgl. It auto render canvas. But when i used mask. It doesn't work correct??? it wrong position. I use console of browser to change position of mask, but not effect????

mask position set not effect on canvasrenderer mode.?  how to anchor graphics mask? when resize the game. the mask is not resize?

My code:

this.game = new PIXI.Application(800, 450, { antialias: true, transparent: true, resolution: 1 });
        $("#game-container").append(this.game.view);
        this.mainGroup = new Container();
        this.effectGroup = new Container();
        this.game.stage.addChild(this.mainGroup, this.effectGroup);
        //create group
        this.containerColumn1 = new Container();
        this.containerColumn2 = new Container();
        this.containerColumn3 = new Container();
        this.containerColumn4 = new Container();
        this.containerColumn5 = new Container();
        this.mainGroup.addChild(this.containerColumn1);
        this.mainGroup.addChild(this.containerColumn2);
        this.mainGroup.addChild(this.containerColumn3);
        this.mainGroup.addChild(this.containerColumn4);
        this.mainGroup.addChild(this.containerColumn5);

this.mask = new Graphics();
        this.mask.drawRect(0, 0, 606, 330);
        this.mask.position.set(97, 43);
        this.mainGroup.mask = this.mask;

 

how to anchor mask when resize game??

 

[ivan.popelyshev]

You havent add mask to the stage. And i suppose you have to use beginFill and endFill there, we had cases like that.

Also, it depends on which elements you add mask as a child in, mask will use parent transform, all coordinates of mask are relative to the parent.

[rossi46]

5 hours ago, ivan.popelyshev said:

You havent add mask to the stage. And i suppose you have to use beginFill and endFill there, we had cases like that.

Also, it depends on which elements you add mask as a child in, mask will use parent transform, all coordinates of mask are relative to the parent.

can you give me an example. or how to set position of mask as sprite mask when game canvas resize. thanks

[ivan.popelyshev]

I dont know how do you implement game canvas resize, so I cant help it. Make a fiddle, please

[tywang2006]

put your mask in the same container of your reels, then implement it.

you can check if your mask is covering the whole reels, disable mask, and show your mask sprite area.

[rossi46]

5 hours ago, ivan.popelyshev said:

I dont know how do you implement game canvas resize, so I cant help it. Make a fiddle, please

thanks. i did it. it work perfect

[rossi46]

5 hours ago, tywang2006 said:

put your mask in the same container of your reels, then implement it.

you can check if your mask is covering the whole reels, disable mask, and show your mask sprite area.

thank for your help. How smothie slot game. When i open 4 tab of game and spin. It lag and not smooth. how do maximum performance and fps smooth?? i usually create prototype and after one sence i destroy all container. have any good idea to manage memory, my game init about 120mb after many spin slots, memory up to 1gb or greater than that. thanks. Sorry for my bad english

[themoonrat]

I find that if I open 2 games side by side, requestAnimationFrame itself only fires 30 times a second on each tab rather than the usual 60, even though my PC could easily handle both at 60. The browser itself throttles how often it sends requestAnimationFrame and there's nothing you can do to stop that.

I would record a time before and after you call renderer.render( stage ), and see how much time in ms each render is taking. Also measure how long between each requestionAnimationFrame request has come in. Here you can compared the difference. If the render time is only 2 ms, but there's 33ms between rAF calls, then it's not your game that is causing the lower frame rate. If your game render time takes 20ms, then you are over budget for a 60fps game and thus you have optimisations to do

[tywang2006]

22 hours ago, rossi46 said:

thank for your help. How smothie slot game. When i open 4 tab of game and spin. It lag and not smooth. how do maximum performance and fps smooth?? i usually create prototype and after one sence i destroy all container. have any good idea to manage memory, my game init about 120mb after many spin slots, memory up to 1gb or greater than that. thanks. Sorry for my bad english

You need to implement delta time for spinning, it happened with WEBGL. but it is not that big deal if it is slow when 4 tabs opened. 

for the momeny, you better enable gc to be auto. but it norally working well with Webgl, it will release texture you havent used in GPU. for rest of them, you have to investigate your code. my game size is extra hd and texture quality is extremely high, 60 fps and upto 300 mb, then ram goes down. you gotta check your code to avoid memory leak

[rossi46]

On 6/21/2017 at 7:56 PM, tywang2006 said:

You need to implement delta time for spinning, it happened with WEBGL. but it is not that big deal if it is slow when 4 tabs opened. 

for the momeny, you better enable gc to be auto. but it norally working well with Webgl, it will release texture you havent used in GPU. for rest of them, you have to investigate your code. my game size is extra hd and texture quality is extremely high, 60 fps and upto 300 mb, then ram goes down. you gotta check your code to avoid memory leak

when i create some mini game with other canvas in one page. the main slots games tween very lag. How to prevent that. example  site: http://zon.club. Use iframe in the main slot canvas??? Thanks