# Plotting Parametric Equations

**URL:** <https://discourse.processing.org/t/plotting-parametric-equations/18947>\
**Category:** Coding Questions\
**Created:** [March 23, 2020, 8:11pm UTC](https://discourse.processing.org/t/plotting-parametric-equations/18947 "2020-03-23T20:11:24Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![rubbs](https://avatars.discourse-cdn.com/v4/letter/r/838e76/32.png) [@rubbs](https://discourse.processing.org/u/rubbs)\
**Post date:** [March 23, 2020, 8:11pm UTC](https://discourse.processing.org/t/plotting-parametric-equations/18947/1 "2020-03-23T20:11:24Z")

</div>

Hello,

I believe that I have almost correctly drawn-out a hyperbolic helicoid:  
([https://mathworld.wolfram.com/HyperbolicHelicoid.html](https://mathworld.wolfram.com/HyperbolicHelicoid.html)).  
But there is some odd behavior, I think it’s because I am not calculating torsion correctly, or it could be the casting from double to float.

```auto

/** 
  TITLE: Hyperbolic Helicoid
  LAST UPDATED: Sunday 23nd March 2020
  BY: Callum Clegg
  
  DESC: This program 'draws' a wireframe hyperbolic helicoid (in Java).
                   
*/

// -----------------------------------------------------------------------------
// Global variables/imports

import peasy.*;

ArrayList<PVector> points = new ArrayList<PVector>();
ArrayList<PVector> HP = new ArrayList<PVector>();

float p;
float u;
float v;
float tau;
PeasyCam cam;

// -----------------------------------------------------------------------------
void setup() {
  size(800, 800, P3D);
  background(20);
  colorMode(HSB);
  avoidClipping();
  cam = new PeasyCam(this , 5000);
}

void draw() {
  background(20);
  
  //HELICOID
  //points.add(new PVector(x(p), y(p), z(p)));
  //p+=0.0521;
  //showData();
  
  for (float tau = -10; tau <= 10; tau+=0.05) {
    HP.add(new PVector((float)hyperX(u, v, tau), (float)hyperY(u, v, tau), (float)hyperZ(u, v)));
    u += 0.0005;
    v += 0.01;
    //tau += 0.01;
  }
  present();
}
// -----------------------------------------------------------------------------
void showData() {
  noFill();
  stroke(100,180,200);
  strokeWeight(5);

  translate(width / 2, height / 2);

  beginShape();
  for (PVector v : points) {
    vertex(v.x, v.y, v.z);
    
  }
  endShape();
}
// -----------------------------------------------------------------------------
void present() {
  noFill();
  stroke(200,180,200);
  strokeWeight(5);
  

  translate(width / 2, height / 2);
  beginShape();
  for (PVector v : HP) {
    vertex(v.x, v.y, v.z);
  }
  endShape();
}
// -----------------------------------------------------------------------------
// Parametric equations for hyperbolic helicoid

float torsion;

float tangent;
float normal;
float binormal;

double hyperX(float u, float v, float tau) {
  return ((Math.sinh(v) * cos(tau * u)) / 1 + Math.cosh(u) * Math.cosh(v));
} 

double hyperY(float u, float v, float tau) {
  return ((Math.sinh(v) * sin(tau * u)) / 1 + Math.cosh(u) * Math.cosh(v));
}

double hyperZ(float u, float v) {
  return ((Math.cosh(v) * Math.sinh(u)) / 1 + Math.cosh(u) * Math.cosh(v));
}
// -----------------------------------------------------------------------------
// Parametric equations for helicoid

float x(float p) {
  return 1000 * cos(p);
}

float y(float p) {
  return 1000 * sin(p);
}

float z(float p) {
  return p*100; // return p?
}
// -----------------------------------------------------------------------------
// Reduce clipping (greater area in view of 'cam')

void avoidClipping() {
  perspective(PI/3.0, (float) width/height, 1, 1000000);
}
// -------------------------------------END-------------------------------------

```

If anyone has any suggestions I would be most greatful.

Many thanks,  
Callum

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [March 23, 2020, 8:25pm UTC](https://discourse.processing.org/t/plotting-parametric-equations/18947/2 "2020-03-23T20:25:31Z")

</div>

start by saving as a new version and do some house cleaning:

delete

```auto
ArrayList<PVector> points = new ArrayList<PVector>();

```

and functions x,y,z and `showData() `

Thank you!

---

<div class="post-metadata">

**Author:** ![rubbs](https://avatars.discourse-cdn.com/v4/letter/r/838e76/32.png) [@rubbs](https://discourse.processing.org/u/rubbs)\
**Post date:** [March 23, 2020, 10:26pm UTC](https://discourse.processing.org/t/plotting-parametric-equations/18947/3 "2020-03-23T22:26:06Z")

</div>

```auto
// -----------------------------------------------------------------------------
// Global variables/imports

import peasy.*;

ArrayList<PVector> HP = new ArrayList<PVector>();

float p;
float u;
float v;
float tau;
PeasyCam cam;

// -----------------------------------------------------------------------------
void setup() {
  size(800, 800, P3D);
  background(20);
  colorMode(HSB);
  avoidClipping();
  cam = new PeasyCam(this , 5000);
}

void draw() {
  background(20);
  
  for (float tau = -10; tau <= 10; tau+=0.05) {
    HP.add(new PVector((float)hyperX(u, v, tau), (float)hyperY(u, v, tau), (float)hyperZ(u, v)));
    u += 0.0005;
    v += 0.01;
    //tau += 0.01;
  }
  present();
}

// -----------------------------------------------------------------------------
void present() {
  noFill();
  stroke(200,180,200);
  strokeWeight(5);
  

  translate(width / 2, height / 2);
  beginShape();
  for (PVector v : HP) {
    vertex(v.x, v.y, v.z);
  }
  endShape();
}
// -----------------------------------------------------------------------------
// Parametric equations for hyperbolic helicoid

float torsion; // variables below necessary??

float tangent; // tangent vector
float normal; // normal vector
float binormal; // binomial vector

double hyperX(float u, float v, float tau) {
  return ((Math.sinh(v) * cos(tau * u)) / 1 + Math.cosh(u) * Math.cosh(v));
} 

double hyperY(float u, float v, float tau) {
  return ((Math.sinh(v) * sin(tau * u)) / 1 + Math.cosh(u) * Math.cosh(v));
}

double hyperZ(float u, float v) {
  return ((Math.cosh(v) * Math.sinh(u)) / 1 + Math.cosh(u) * Math.cosh(v));
}
// -----------------------------------------------------------------------------
// Reduce clipping (greater area in view of 'cam')

void avoidClipping() {
  perspective(PI/3.0, (float) width/height, 1, 1000000);
}
// -------------------------------------END-------------------------------------

```

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [March 26, 2020, 11:04pm UTC](https://discourse.processing.org/t/plotting-parametric-equations/18947/4 "2020-03-26T23:04:06Z")

</div>

Hello,

I am busy with other concerns these days but this was a fun distraction.

Some observations about your code:

- Formula is missing brackets in denominator:  
`return ( (Math.sinh(v) * cos(tau * u) ) / (1 + Math.cosh(u) * Math.cosh(v)) );`

- I quickly ran out of memory; it was over 4GB!  
I modified this for the development phase to resolve memory issues:

```auto
  //beginShape();
  for (PVector v : HP) {
    strokeWeight(2);
    stroke(255, 255, 0);
    point(200*v.x, 200*v.y, 200*v.z); // The 200 was used to scale 
  }
  //endShape();

```

- I did not use PeasyCam or the avoidClipping() function.  
I wanted to simplify things and used this for my exploration of your code:

```auto
  translate(width/2, height/2, 0);
  float angle = map(mouseX, 0, width, TAU/4, -TAU/4);
  rotateY(angle);
  angle = map(mouseY, 0, width, -TAU/4, TAU/4);
  rotateX(angle);

```

Getting there:  
 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/0/0865d5a0ad01b59b8cab89e09794ad2192f5a062.png)

I shared my brief exploration and observations.  
I will leave the rest with you.

`:)`

I did some work on a [Mobius Strip](https://discourse.processing.org/t/mobius-strip-animation/13273/6) a while back that may be of interest.