Is there anyway to use the NEAREST_SAMPLINGMODE with Image controls in the GUI

Questions
1

See the example here:

If you scale up an image control large, it’s blurring the texture to scale it. Is there anyway to get the crisp nearest sampling mode to work like it does on meshes?

Setting the sampling mode at the ADT level doesn’t seem to work.

2

Unfortunately as GUI is using Image from DOM we do not have control over sampling mode :frowning:
the way you can get crisper image is to use advancedTexture.renderScale = 2

3

Thanks for confirming. That’s kind of what I was expecting. I might end up using SVG then to get those nice crisp lines.

1 Like
4

Sorry to dig this thread up but I was also trying to get GUI images to look crisp.
I got it to work for me by changing imageSmoothingEnabled to false on the canvas’ context.

See lines 44 / 45:
https://playground.babylonjs.com/#ZN2PDZ#2

Note that you need to reset this property to false on resize of the window.

Maybe this helps out.

1 Like