pranastons

problem in chrome on MacOS - stretching and scaling image

Recommended Posts

Hey. I have a big problem. This behavior was seen only in Chrome macros. I have several containers with sprites, only one is displayed at a time. Multiple 1920/1080 sprites are simultaneously in the container. The container also has this size initially. (I need to make a background image)
When you go through browser tabs for a while or are inactive, the image is oversizing. It is getting huge. I do not understand why this is happening.

I need the image to scale adequately when resized, and not stretch.

Any help would be very important to me.

Share this post


Link to post
Share on other sites

I need to make an image full screen with 3d effect. for this I use a DisplacementFilter with a depth map.
for exaple, normal image look like this 
image.png.ac213d5c74b7ec3c077e31df72afc8c4.png

and after bug, you will can see somthink look like this  

 

image.png

 

this effect can see in macOS (exactly google chrome, may be in another browsers too)

Edited by pranastons

Share this post


Link to post
Share on other sites

today I have seen that the same problem occurs if set param "resolution" upper then 1 (I looked this effect in widnow 10 OS, version pixi 4.8.4 )

I would like to get any recommendations for solving this problem. (image which i need used have bad render with "resolution" = 1) 

and can I suggest that the same reason lies at the basis of the effect that can be observed on MacOS with version pixi 5 (with default resolution )

Share this post


Link to post
Share on other sites


       displacementSprite.texture.baseTexture.wrapMode = PIXI.WRAP_MODES.REPEAT;
       transitionFilter = new Filters.DisplacementFilter(this.displacementSprite);
       transitionFilter.resolution = 0.5;

       displacementSprite.anchor.set(0.5);
       displacementSprite.x = this.app.renderer.width / 2;
       displacementSprite.y = this.app.renderer.height / 2;
        transitionFilter.autoFit = true;

       displacementSprite.scale.x = 2;
       displacementSprite.scale.y = 2;

        mainContainer.addChild(this.displacementSprite);
        mainContainer.filters = [transitionFilter];
       transitionFilter.scale.x = this.options.displaceScaleTo[0];
        transitionFilter.scale.y = this.options.displaceScaleTo[1];

 

Share this post


Link to post
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.

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

  • Recently Browsing   0 members

    No registered users viewing this page.