Jump to content

Nearest Sample Mode creating strange features


Recommended Posts

Hia guys!

I'm having this problem that I can't seem to get replicated in the playground! Not sure why!
Basically, I have this sprite here:

And I have a material too! Here's what it looks like:

var tex = new BABYLON.Texture("monster.png", scene, false, true, BABYLON.Texture.NEAREST_SAMPLINGMODE);
var mat = new BABYLON.StandardMaterial("mat", scene);
mat.diffuseTexture = tex

Seems simple enough! And yet, something is strange. I'm guessing this has to do with the nearest sampling mode? But here is the output! I've drawn squares around what I want you to notice:

Notice how the width of some pixels are thin, when they should be the same length as everything else! It's even worse on this little guy:

Originally, this sword looks like this:


So what am I doing wrong? O_O It looks like when you scale an image in a image editor incorrectly or something :)

Thanks! And sorry about the massive pictures, not sure if it's possible to shrink them or something here..


Link to comment
Share on other sites

5 hours ago, Deltakosh said:


for the sword this seems to be related to a texture stretching (like if the mesh is not a square)

Can you try to use the same texture on the playground? On a simple plane

Oh, sorry that's because it's rotated! This is not the case, because individual pixels should at least have the same ratio, (even if they were stretched!) But it ain't.
And yaaaa here's a playground!!!

Notice the strange irregularities? I'm not sure what to make of it! Here's a comparison:

Thanks for the reply! :D


Link to comment
Share on other sites

Yupppp I'm confused too. You known when you scale a pixel image in GIMP or Photoshop without any interpolation, if it's not exactly scaled correctly, the pixels will be off? This reminds of that O_O
I would venture to say it's identical to that. But then, where is the origin of the problem? Maybe some sort of scale value is rounded or something, causing something to go crazy>

Link to comment
Share on other sites

"course of" = "cuz of" = "because of"  ?  (just checking) 

I need to read the latest English Language Update Bulletins.  Perhaps I have fallen behind. :)

Nice solve!  Nabs just forces the issue... right before our very eyes... in line 27.  You're a God, Nabsy!

Link to comment
Share on other sites

Aww sadly this is not what I'm looking for!
I'm in deep need of a pixel form. In other words, I need it to look exactly like the sprite, with all of those crispy and sexy pixels!!!

One thing I'm not sure is: is nearest neighbor the interpolation I need? Is there such thing as "no interpolation", as in the pixels just scale? In GIMP there is that option when scaling:


Or is the "none" simply the nearest neighbor algorithm? If so, then I believe there may be a problem with the interpolation algorithm in Babylon itself. D:

Oh, and for me, your last example looks like this:

Link to comment
Share on other sites

Change your texture to be a power-of-two size (e.g. size it up to 1024x1024).

WebGL requires texture sizes to be powers of two, so when necessary BJS resizes images behind the scenes. Your texture here is getting distorted during that resize, not as part of the rendering process.

Link to comment
Share on other sites

10 hours ago, Deltakosh said:

what kind of warnings? "You are not using a POT2 textures" ?

Yeah that could work! "Scaling without using POT2 textures may result in visual oddities" or something ;)
But maybe make it only say it once for the whole time cause otherwise it'd get spammy O_O Either that or only make it say that when you are using nearest neighbor :D

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.

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.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...