Fix slow frame rate when drawing multiple quads?

I'm drawing a section of a radial graph with quads and animating the "opening" of the arc. Each arc contains a fair amount of quads being drawn to the screen and consequentially the frame rate is dropping substantially. Any suggestions to keep the frame rate from dropping so dramatically?

Here is the code that draws the arc. The method is being called from the draw() so that I can animate the arc on demand.

float angle;
float x;
float y;

public void drawAniWedge(float ani)
    angle = radians(360)-rotation;
    x = width/2 +  cos(angle) * dataList.get(0);
    y = height/2 + sin(angle) * dataList.get(0);

    for (int i = 1; i < dataList.size(); i++) 
      float dataLength = dataList.size()-1;
      float increment = dataLength/ani;
      angle = radians(i/increment)-rotation;

      newX = width/2 +  cos(angle) * dataList.get(i);
      newY = height/2 + sin(angle) * dataList.get(i);


      quad(width/2, height/2, width/2, height/2, x, y, newX, newY);

      x = newX;
      y = newY;

Here is what I am drawing:

image alt textarc


  • Random thoughts: you can put the first two lines of the loop outside of the loop. Same for fill and stroke calls apparently constant through the loop.

    But I doubt you will get a big speed boost from these changes. That's probably quad() which is slow. BTW, why not use triangle() there?

  • My apparently failed attempt on optimizing your function: :-S

    // fix-slow-frame-rate-when-drawing-multiple-quads
    final FloatList dataList = new FloatList();
    void setup() {
      size(600, 600, JAVA2D);
      for (int i = 0; i++ != 45; dataList.append(random(height>>1)));
      drawAniWedge(dataList, 180, 90, #0000FF, #FF0000);
    void drawAniWedge(FloatList dl, float ani, float rot, 
    color ink, color border) {
      final int len = dl.size();
      final float inc = (len - 1) / ani;
      final float cx = width>>1, cy = height>>1;
      int i = 0;
      float datum = dl.get(i);
      float ang = TAU - rot;
      float x = cx + cos(ang)*datum;
      float y = cy + sin(ang)*datum;
      while (++i != len) {
        datum = dl.get(i);
        ang = radians(i/inc) - rot;
        final float xx = cx + cos(ang)*datum;
        final float yy = cy + sin(ang)*datum;
        quad(cx, cy, cx, cy, x, y, x = xx, y = yy);
  • @PhiLho I don't know why I didn't think to use triangle()! Fixed that and took those elements out of the loop. Thanks for the advice.

    @GoToLoop thanks for having a go at it!

Sign In or Register to comment.