Sign in to follow this  
robmyers

Shape too complex to fill

Recommended Posts

Hi,

 

First of all, thanks for the great library!

 

I'm using the WebGLRenderer and I am rendering a number of polygons (actually convex 4-gons) into a single PIXI.Graphics instance. They are adjacent to each other, and I'm receiving the error "Shape too complex to fill" -- unsurprisingly certain polygons aren't getting filled.

 

If I don't use a lineStyle then the error goes away. Also, if I use a lineStyle but don't connect back to the initial point (for each polygon), again the error goes away, although now I'm missing a line.

 

Although I haven't tried it, I suspect the problem should also go away if I use multiple PIXI.Graphics instances. However, this will mean a lot of instances (which are also continually changing)... and will probably effect performance (?).

Is there any way around this?

 

Many thanks,

Rob

 

 

Share this post


Link to post
Share on other sites

I don't think there is anything wrong with the code... I say this because it works fine when I don't use lineStyle.

 

Anyway, here is the function which draws the polygons.

 

 

g = the single PIXI.Graphics instance used to draw all the polygons.

camera = an object I'm using to project 3d points, which take the form this[0], this[1], ... 

render : function(g,camera){		var i, proj;		g.beginFill(0x000000);		//g.lineStyle(0.1, 0xFF0000, 1);		proj = camera.project3d(this[0]);		g.moveTo(proj.x,proj.y);		for(i = 1; i < this.length; i++){			proj = camera.project3d(this[i]);			g.lineTo(proj.x,proj.y);		}		//proj = camera.project3d(this[0]);		//g.lineTo(proj.x,proj.y);		g.endFill();	},

If I uncomment "g.lineStyle(0.1, 0xFF0000, 1);" then I get polygons with red borders on 3 of the 4 sides (as expected).

However, if I also uncomment the other two lines, so that I am completing the polygon, then I sometimes get the error "Shape too complex to fill".

 

Perhaps this happens because I am drawing many polygons adjacent to each other?

 

Cheers,

Rob

Share this post


Link to post
Share on other sites

Hi,

 

I include three pictures.

For the first two I am using the WebGLRenderer.

 

1. I use lineStyle and close each polygon (I get "Shape too complex..." errors):

 

With_Line_Style.png

 

2. I use lineStyle and I do *not* close each polygon (I get no errors):

 

With_Line_Style_Not_Closed.png

 

Note that one edge of each polygon is not drawn in red.

 

3. Finally, if I use the CanvasRenderer then I get the best image (and no errors), whether or not I close each polygon.

 

With_Line_Style_Canvas.png

 

 

Thanks a lot for your help.

Share this post


Link to post
Share on other sites

Sadly not.

 

The errors change dependent upon whether antialiasing is on, and even then the lines aren't rendered properly (see the first two diagrams above, I have no control over the red lines).

It might be because I'm using a 2008 Mac, which possibly has dodgy webgl drivers, although I'm reaching here.

 

Anyway, thanks for the suggestion.

Share this post


Link to post
Share on other sites

Ah well, maybe I was right.

 

 

It seems that in Chrome I need "Override Rendering List" enabled for PIXI to detect WebGL, which means my configuration is unsupported.

 

 

I was never seeing any errors with the canvas renderer, so I guess this problem is solved.

Share this post


Link to post
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.

Guest
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.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.