Graphics problem Node-Webkit

Ever since the release of version 133, I've been having issues with the environment tiles and sprites not properly merging side to side with eachother. It's like a small line that splits them apart. This only happens after I've exported to node-webkit. It works fine when previewed in google chrome. All sprites and tiles tops a power of two number. For instance most of the environment sprites/tiles are 256x256 exact.

Link to .capx file (required!):

The .capx is pointless since it works perfectly in the preview, and it also worked flawlessly in node-webkit until version 133r. I haven't made any changes whatsoever to the tiles in weeks.

You can see the problem for yourselves in this build of the game:

http://www.mediafire.com/download/akq4mfpy110tbo6/Klang_17_6.zip

There's also screenshots further down in the description.

Steps to reproduce:

1. Export the game to node-webkit with standard image compression and minimized script

2. Play game

3. Discover that the sprites and tiles doesn't perfectly merge with eachother

Observed result:

Might have to zoom in a bit to truly see it. I've marked the most noticable offenders with white.

puu.sh/3ivlh.png

puu.sh/3ivlw.png

Expected result:

These lines shouldn't happen. It should look like this:

puu.sh/3ivRF.png

puu.sh/3ivRT.png

Notice that the sprites and tiles are here perfectly placed right next to each other.

Browsers affected:

Node-webkit: Yes

Chrome: no

Firefox: not tested

Internet Explorer: not tested

Operating system & service pack:

Windows 7 64-bit, service pack 1

Construct 2 version:

133 and beyond

Closing, please provide a minimal .capx reproducing the problem. A 100mb file of a built game is not really useful at all for the purposes of investigating a bug.

Note lots of people report bugs with rendering seams which are a consequence of their own project settings. To guarantee seamless rendering, you must use pixel rounding, point sampling and letterbox integer fullscreen (or no fullscreen mode). Otherwise you are choosing settings that may cause seams, which is not a bug. When seams occur can vary from platform to platform, even between Chrome and node-webkit (which is based on Chromium), because the details of the rendering system are different.

Thank you for the tips, seems like the render settings was the culprit. Does pixel rounding consume more resources than having it off, and is point sampling heavier to run than linear?

Sorry if I posted the topic in the wrong forum.

Edit: With some experimenting it seems that "Letterbox scale" was making the seams. The only problem is that I'm very dependent on having an absolute full screen. This setting didn't make any seams before, has there been made any changes to the webkit recently which alters how the letterbox scale renders the image? Even if it works in "Letterbox integr scale", I can't really use it.

Thanks

i have the same thing , problem with my ATI graphic card , and no problem with a Nvidia card :(

I think it's an issue with the level architecture (meaning usage of sprites/tiles) vs screen resolution and scaling.

It looks like you are using a whole lot of Sprites at an approx 256x256 resolution. Since you prolly use linear filtering and no Integer Scale those results are possible.

When you export in a fixed resolution, do you still have these problems?

You should adjust your screen brightness since the problem also happens on your background (the gradient).

anata :it also happens on Nvidia, the result might not be as evident, but it happens

On a side note ... your game looks great, but it's too damn hard ;)

rock on,

Michael

For the record, not adding the 1px transparent border to your sprites/tiles can cause seams and in some cases a missing row of pixels on your sprites when on a certain part of the screen. Not sure why no one has mentioned it. I would say it's a bug on C2's part.

You definitely can't guarantee seamless rendering with "letterbox fullscreen". Since it can use any scale, even floating point scales like 1.317, you can't guarantee that layout pixels will line up perfectly with screen pixels. Enabling letterbox integer scale preserves this guarantee, by ensuring the zoom level is an integer.

There are tricks you can employ to get seamless rendering with letterbox scale. Things like ensuring all your tiles overlap each other by 1 pixel generally ensures seams are covered up (a seam is usually the background showing through at a low opacity), or just choosing a background color close to the tile colors can help. Sometimes there are even graphics card driver bugs that can cause seams, so updating your drivers might help.

However the easiest way to guarantee seamless rendering is to use those settings.

Tokinsom - I've not heard of any bug like that. Has it been reported?

I'll see if I can make a .capx for it. I just quit using ctrl+crop and made sure everything had 1px transparent borders and it's bee fine since.

Thanks for the tips, and I'll definately take them into consideration, but I'm still puzzled over why this issue came up first very recently for me. Ever since I bought construct back in april, I haven't had this issue, even with letterbox scale. Updating the drivers didn't help either. (Nvidia GTX580)

Grave Yes it works when I export it to its native resolution (1280x720). Also thank you! When did you feel it got too hard?