Jump to content

Google Chrome Shifting Canvas Bug


HotNoob
 Share

Recommended Posts

Hi, 

Not sure why, but i am unable to even find anyone mentioning this bug... yet i've been running into it ever since i first tried HTML5... and that was around 2011... 

So, i've now just decided to take on a more serious approach to HTML5 for game dev; as it is quick, easy, and for multiple mobile devices.

You can see the bug in the video, starting at ~2:40, as the edges of the game start to shift. 

https://www.youtube.com/watch?v=hmKgb3vearI&list=UU2tq0y4VE81QV2RSy-qreog

This only happens in chrome, ie and firefox don't show this bug.

I'm guessing that it is related to the objects going off screen ( which are removed as soon as they are completely off the screen )
The shifting happens completely randomly, in random direction. 

it is very disappointing to see that this bug still exists after 3 years.

Anyone have any work arounds?

Link to comment
Share on other sites

it is very disappointing to see that this bug still exists after 3 years.

I've also never heard of or experienced this bug.

What about anyone else out there reading this?

Are you sure it's a bug in canvas, and not the game engine you're using or your game code?

Link to comment
Share on other sites

I've also never hear of or experienced this bug.

What about anyone else out there reading this?

Are you sure it's a bug in canvas, and not the game engine you're using or your game code?

bug doesn't happen in firefox, safari, ie, android's webview, it just happens in google chrome. 

12 years of programming experience; i know the difference between a bug that i wrote, and whatever medium i'm using. 

 

Link to comment
Share on other sites

a bug in the code would not ONLY show on google chrome.

the bug doesnt even show on chromium...

Other developers do not have that issue. It might be a floating point issue or something else.

And what reason could there be that it starts shifting after 2:40 and not before? Because something in your code must happen around that time.

Link to comment
Share on other sites

That's a strange issue - would be interesting to know what that is. Certainly looks like it could be an accumulation of floating point errors in the translation, or something similar.

 

I've seen examples of different browsers behave differently with regards to non-integer co-ordinates. For example, in canvas 2D, if I pass a non-integer X or Y position to drawImage(), I would expect the browser to perform a draw on sub-pixels. Most do, but Safari on iOS seems only to draw on whole pixels. Safari on iOS will do sub-pixel rendering if given a non-integer transform, and Safari on MacOS will do sub-pixel rendering using drawImage() only! It's more of a grey area than a bug, and some might argue an "optimisation"...

 

One possibility is that your code might need to account for differences in behaviour between browsers, and that it's not actually a bug in either your code of Chrome's. Regardless, it would be interesting if you manage to tie this down.

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.

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