Combining my own webgl code with pixi

[mudyc_]

Hi,

 

I have tried to bind existing webgl code with Pixi. I want to put an adapter class into PIXI.Container but it doesn't seem to be that easy. I have inherited a small class from PIXI.DisplayObject and put that instance into Container.

 

The issues. Within the container I have Text sprites and these and my adapter instance are not working together.

First issue was wrong program.

 

  WebGL: INVALID_OPERATION: uniformMatrix3fv: location is not from current program

 

I fixed that by calling

 

  renderer.shaderManager._currentId = -1;

 

in my renderWebGL method to say that other Sprite needs to reload the program.

But I still have:

 

  [.WebGLRenderingContext-0x7f911d128d20]GL ERROR :GL_INVALID_VALUE : glBufferSubData: out of range

 

In the end webgl has too many errors and does not work anymore. And I have no glue how to fix that. So my questions are:

 

- What is the proper way to create new webgl objects that I can use with existing sprites etc. with Pixi?

- Is shaderManager._currentId = -1; right way to avoid program clash?

- What is the most evident cause of the glBufferSubData issue? E.g., Have I forgot to close something in my webgl code before giving execution to Sprite's code?

 

 

 

 

 

 

 

[mudyc_]

I managed to fix that issue as well. I needed to add Sprite.start() method call at the beginning of Sprite.flush() - it sounds I am miss using pixi at the moment..

[xerver]

Are you trying to do this with v2 or v3?

 

Have you looked at how other features in v3 (sprites for example) are implemented? We usually have an object (Sprite) and a renderer (SpriteRenderer). Without seeing your code there is no magical method that will fix your problems because I don't even know what you are doing wrong

 

The basic idea is that your object, when being rendered just ensures the proper renderer is set and renders itself. For example, Sprite#_renderWebGL:

Sprite.prototype._renderWebGL = function (renderer){    renderer.setObjectRenderer(renderer.plugins.sprite);    renderer.plugins.sprite.render(this);};

It is then the SpriteRenderer#render method's job to flush the batch if necessary and do other things. When the object renderer changes (switches to your custom renderer) the WebGLRenderer will call stop of the current renderer and start of the new one you passed in.

 

Hopefully that helps you get started making a custom Object and ObjectRenderer. The best thing to do is just mimic what our built-in object renderers do already.