Text display issues in HTML5

[pmarin]

Hi! I am having some display issues in the HTML5 version of my game, which are not present in the Windows version.

I made a top-down racing game in GM 1.4.9999 and the current laptimes are displayed on screen. In windows, the timer is drawn perfectly, but on HTML5 there are some glitches, although the font is drawn without problems, the width of the text shown varies and there seems to be some ghosting with the text drawn on previous frames.

I tried disabling OpenGL, making it mandatory, but the problem persists. I also thought that it was an issue by the way that HTML browsers make divisions (the amount of decimals), and used rounding to avoid it, but the problem persists.

I think its easier seen than explained, here is the link to the game, just start any race and watch the timer: https://misterakuma.itch.io/pretend-cars

Any help or ideas on what to look for would be greatly appreciated!

 

[pmarin]

I found a way to mitigate the problem with two changes, its not flawless but results are much better. I'll post them here to help others with a similar issue.

1. I rounded the timer to 1 decimal place, which minimizes the visual glitches
2. As multiples views dont work in HTML5, I was using a method to copy those view to different surfaces but it seems that there are some issues with the way that I implemented it. I tried an asset by Felix Paulsen to do the same and it works better (it uses view_surface_id which I wasn't using before). Here is the link to that asset: https://felix-paulsen.itch.io/html-split-screen-asset (I had to rework it as it doesnt work when you have a port with different size than your view)