# Display incremental image changes in draw()

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.

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.

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);
}

``````

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.

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.

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