noSmooth() makes textures with NEAREST interpolation blurry
Open
Nobody has claimed this yet.
Area:WebGL
Bug
- Dominant language
- JavaScript
- Stars
- 24k
- Forks
- 3.8k
- Avg merge
- 3d 16h
- Merged PRs (30d)
- 25
Description
Most appropriate sub-area of p5.js?
- Accessibility
- Color
- Core/Environment/Rendering
- Data
- DOM
- Events
- Image
- IO
- Math
- Typography
- Utilities
- WebGL
- Build Process
- Unit Testing
- Internalization
- Friendly Errors
- Other (specify if possible)
p5.js version
1.7.0
Web browser and version
115.0.5790.111
Operating System
Windows 10
Steps to reproduce this
Steps:
- Create a small texture that you can tell is or isn't pixelated
- Create the canvas and set it to
noSmooth() - Set the interpolation to NEAREST
Snippet:
let img;
let canvas;
function preload() {
img = loadImage('<pixelated image goes here>');
}
function setup() {
canvas = createCanvas(400, 400, WEBGL);
noSmooth(); // ironically the image only smooths/blurs if this is on
canvas.getTexture(img).setInterpolation(NEAREST, NEAREST);
}
function draw() {
background(0);
image(img, -width / 2, -height / 2, width, height);
}
In case you don't want to copy and paste it here's the sketch: https://editor.p5js.org/PotatoBoy/sketches/vgaD3vTok
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked sketch and the interaction between noSmooth(), canvas.getTexture(img).setInterpolation(NEAREST, NEAREST), and the WebGL image() call. Reproduce the blur in p5.js 1.7.0, then trace the relevant texture and rendering behavior; done means NEAREST textures remain pixelated when noSmooth() is enabled, with regression coverage if the existing test structure supports it.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- computer-graphics
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100