Jump to content

A limitation on the number of Graphics primitives?


Recommended Posts

I have played with pixi.js a couple of days and faced a weird limitation. It looks like there's a limitation on the number of graphics primitives, but can't find anything about it in here or in docs. Here's a repro code:

        stage = new PIXI.Stage(0);        var ts = 5, w = 160, h = 160;        renderer = PIXI.autoDetectRenderer(w * ts, h * ts);        document.getElementById('content').appendChild(renderer.view);        graphics = new PIXI.Graphics();        graphics.drawRect(0, 0, w * ts, h * ts);        //graphics.lineStyle(0, 0xffffff, 1);        for (var i = 0, x = 0, y = 0; i < w * h; i++, x += ts) {            if (x >= w * ts) {                x = 0;                y += ts;            }            graphics.beginFill(0xff0000);            graphics.drawRect(x, y, ts - 1, ts - 1);        }        stage.addChild(graphics);        renderer.render(stage); 

The problems is that the square is filled only about 2/3 with red boxes. If I use a line style, the filled area is even smaller. It's the same on IE, Chrome, FF, at least.

Can I overcome this limit somehow?


Link to comment
Share on other sites

I've found a (kind of) workaround to avoid this limitation: create additional Graphics objects and split the stream of primitives into smaller batches. However, it seems to be slower and cause memory allocation issues. It's still the question, how to determine the batch size (10000 primitives per one graphics seems to be ok for rectangles), and what is the source of this limit.

Link to comment
Share on other sites

It's limited by the number of vertices that can be drawn with a single webgl drawElements call, which is 2^16. Each rectangle has 4 vertices, so (2^16) / 4 = 16384  rectangles is the limit. It must be 1/5th of that for rectangles with borders. It's a bug, pixi should be splitting it into smaller batches.

Anyway, use sprites instead, it will be faster for anything more complex than borderless rectangles. See http://www.html5gamedevs.com/topic/11892-awful-frame-rates-under-all-browsers/

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...