Setting buffer data in WebGL

Question

I tried to fill a buffer with data before I had called bindBuffer

const triangleBuffer = context.createBuffer();
// context.bindBuffer(context.ARRAY_BUFFER, triangleBuffer);
context.bufferData(context.ARRAY_BUFFER, triangleVertices, context.STATIC_DRAW);

Then I got an error:

WebGL: INVALID_OPERATION: bufferData: no buffer

I created the buffer in the first line and I don't understand why I can't fill it with data.

Can't I just fill created buffer before binding to context.ARRAY_BUFFER? Are there any reasons for this behaviour?

score 2 · Accepted Answer · 2020-10-21 17:34:46Z

2

ARRAY_BUFFER is an internal WebGL variable (or rather it's an id for an internal WebGL variable)

It effectively works like this

context = {
  ARRAY_BUFFER: 34962,  // this is an enum value

  arrayBufferBinding: null,

  bindBuffer(target, buffer) {
    if (target === this.ARRAY_BUFFER) {
      this.arrayBufferBinding = buffer;
    }
    ...
  },

  bufferData(target, data, hint) {
    let buffer;
    if (target === this.ARRAY_BUFFER) {
      buffer = this.arrayBufferBinding;
    }
    ...
    setDataOnBuffer(buffer, data, hint);
  },
};

So you have to bind the buffer. WebGL doesn't directly set state on most WebGL objects (buffers, textures, renderbuffers, framebuffers, vertex arrays). You have to bind the object and then refer to it based on where you bound it.

See this and this and this

edited Oct 21, 2020 at 17:34

answered Apr 24, 2020 at 4:03

user128511

Sign up to request clarification or add additional context in comments.

5 Comments

Andrew Lis Over a year ago

Thanks. But I don't understood why does bindBuffer require buffer as second argument? Buffer is unused in your example.

user128511 Over a year ago

sorry, that was a typo. buffer is used now.

Andrew Lis Over a year ago

Are there any reasons for why we can't fill buffers with data directly? Or is it just a historical fact?

user128511 Over a year ago

You can't fill them directly because whoever designed the API chose to do it that way. There is arguably no reason why the API could not have been bufferData(buffer, data, hint) but it's not. Note that OpenGL has direct state access functions, for bufferData it's called NamedBufferData. AFAIK it's rare for people to use them just because the indirect way has been the normal since OpenGL shipped.They were only added in OpenGL 4.5 and before that were an optional extension

user128511 Over a year ago

see the linked articles

Collectives™ on Stack Overflow

Setting buffer data in WebGL

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related