Display incremental image changes in draw()

beginners
#1

I want to show how a curve changes when its equation is re-evaluated after a slight change in one parameter. I don’t want to redraw the entire preceding “family” of curves with each new variation. That is, do this:

  1. Draw y = f(x,k)
  2. Increment k
  3. If k < k_limit, go to 1.

Not, at step 1, draw all previous f(x,k) plus new iteration.

I would bet this question has been asked but my searches have apparently not used the right search terms.

#2

It sounds like you just want to use an ofPath to create multiple curves, store them, and increment their positions in response to an event. I might be misunderstanding though. Also, for mathematical plotting, the curves in ofPath might not be exactly what you’re looking for, depending on what kind of resolution you need.

#3

Joshua, thanks for the response. I did a quick search of the examples directory using “ofPath” and found (among others) the /math/trigonometryExample project. This project demonstrates something of what I am aiming for. It also uses a very instructive set of OF functions and classes. I will study it and other related examples.

But just to clarify what the goal is in my first extremely simple OF project I rephrase my initial posting: To demonstrate how a curve evolves when one parameter changes, draw the N-th re-evaluated curve while keeping previous versions visible without redrawing them.

My example is a parameterized version of the cardioid curve. When the parameter ‘k’ is 1.0, you get the regular cardioid. When it is zero, you get a circle. Iterating the drawing with k going stepwise from 0 to 1, you get a nice little animation. Here’s my naive first swing at the OF version (I have a Processing version too).

  
#include "testApp.h"  
  
int nsteps = 100;  
int const arr_size = 101 ;  
int i, j;  
float k_factor;       // if 1, cardiod; if 0, circle  
float t, step, onemkcos;  
float x[arr_size], y[arr_size];  
float x_off, y_off;  
float a = 100;  
  
//--------------------------------------------------------------  
void testApp::setup(){  
    x_off = WIDTH/2 + 50;  
    y_off = HEIGHT/2;  
    ofBackground(255, 255, 255);  
  
    // Create points on cardioid boundary  
    step = 2*PI/nsteps;  
    i = 0;  // Prep for loop  
    k_factor = -0.2 ;  
}  
  
//--------------------------------------------------------------  
void testApp::update(){  
    // Build "cardioid" family member  
    k_factor += 0.2;  
  
    if (k_factor <= 1.0) {  
        for (i = 0; i < arr_size; i++){  
            t = i * step;  
            onemkcos = 1 - k_factor * cos(t);  
            x[i] = a * cos(t) * onemkcos + x_off;  
            y[i] = a * sin(t) * onemkcos + y_off;  
        }  
    } else {  
        ofSleepMillis(5000);  
        ofExit();  
    }  
}  
  
//--------------------------------------------------------------  
void testApp::draw(){  
    // Draw axes  
    ofSetColor(126, 126, 255);  
    ofLine(x_off, 0, x_off, HEIGHT-1);  
    ofLine(0, y_off, WIDTH-1, y_off);  
  
    // Draw black cardiod segment and red radial lines  
    for (i = 1; i < arr_size; i++) {  
        ofSetColor(0, 0, 0);  
        ofLine(x[i-1], y[i-1], x[i], y[i]);  
        ofSetColor(255, 126, 126);  
        ofLine(x_off, y_off, x[i], y[i]);  
    }  
    ofSleepMillis(1000);  
}
#4

Update to last post:
In my target version – the one showing all versions of the circle-to-cardioid transition – red radial lines (53, 54) are not displayed. Too messy and confusing.

#5

Ok, I get that. So you want a vector of ofPath objects. Every time you make a new version, make a new ofPath and put it into the vector:

  
  
vector<ofPath> paths; // declare this is .h file  
  
ofPath newPath;  
// add all paths to newPath  
paths.push_back(newPath);

Hope that helps.

#6

OK, I think I have a good direction now.
Thanks again…