Skip to content

Framebuffer objects cannot be rendered after noTint() #7677

Open
@BRNMan

Description

@BRNMan

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
  • Internationalization
  • Friendly errors
  • Other (specify if possible)

p5.js version

1.11.3

Web browser and version

Firefox 136.0.2

Operating system

Linux Ubuntu 24.04 LTS

Steps to reproduce this

Steps:

  1. Create a canvas
  2. Create a framebuffer.
  3. Apply the noTint() method.
  4. Render the framebuffer to the canvas

Console Error:

p5.min.js:2 Uncaught TypeError: Cannot read properties of null (reading 'slice')
    at i.value (p5.min.js:2:1025180)
    at s.value (p5.min.js:2:1006042)
    at l.default.RendererGL._drawImmediateFill (p5.min.js:2:900625)
    at l.default.RendererGL.endShape (p5.min.js:2:896735)
    at S.default.RendererGL.image (p5.min.js:2:769005)
    at C.default.image (p5.min.js:2:638168)
    at draw (drawing2.js:14:3)
    at e.default.redraw (p5.min.js:2:542412)
    at _draw (p5.min.js:2:467307)

Essentially I think the image command eventually calls setFillUniforms for framebuffers which expects a tint. If you remove the tint, we get an error.

Snippet:

let fb;

function setup() {
  createCanvas(600, 600, WEBGL);
  fb = createFramebuffer();
}

function draw() {
  noTint();
  fb.begin();
  line(0,0,500,500);
  fb.end();
  imageMode(CORNERS);
  image(fb,
    0,0,100,100); 
}

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions