# Quadrifolium curve

**URL:** <https://discourse.processing.org/t/quadrifolium-curve/19887>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [April 18, 2020, 9:46am UTC](https://discourse.processing.org/t/quadrifolium-curve/19887 "2020-04-18T09:46:43Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![ElMatematico53](https://avatars.discourse-cdn.com/v4/letter/e/ee59a6/32.png) [@ElMatematico53](https://discourse.processing.org/u/ElMatematico53)\
**Post date:** [April 18, 2020, 9:46am UTC](https://discourse.processing.org/t/quadrifolium-curve/19887/1 "2020-04-18T09:46:43Z")

</div>

We have created a quadrifolium function, and we may need help to write its tangent. We would like to see the tangent line every time the mouse is on the function, for each point of it

The equation and the parameterization are:

> Equation: (x^6)+(3x^4·y^2)+(3x^2·y^4)+(y^6)-(4a^2·x^2·y^2)=0  
> Parameterization: x=2asin^2tcost and y=2acos^2tsint

The code we have written is:

```auto
void setup(){
  frameRate(30);
  size(600,600);
}
void draw(){
  background(255,255,255);
  stroke(0,0,0);
  cross(300,300);
  println(frameCount);
  stroke(0,0,0);
  line(300,100,300,500);
  line(100,300,500,300);
}void cross(float x, float y ){
  for (int t=0 ; t<2000 ; t=t+1){
    point(x-2*200*sin(t)*sin(t)*cos(t),y-2*200*cos(t)*cos(t)*sin(t));
}
}

```

---

<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:** [April 18, 2020, 10:14am UTC](https://discourse.processing.org/t/quadrifolium-curve/19887/2 "2020-04-18T10:14:09Z")

</div>

Hello,

Please format your post as a courtesy to others in the community:  
[https://discourse.processing.org/faq#format-your-code](https://discourse.processing.org/faq#format-your-code)

Here are some resources for you:

> **Resources**
>
> I encourage you to review the resources available here:
> 
> - The Processing website has references, examples, tutorials, etc.  
> [https://processing.org/](https://processing.org/)
> - Those available with the Processing PDE (IDE).  
> An exploration of the tabs will reveal what is available; there are libraries and examples there.
> - The Coding Train  
> [https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1\_aw](https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1_aw)  
> [https://thecodingtrain.com/](https://thecodingtrain.com/)
> - Happy Coding  
> [Processing Tutorials - Happy Coding](https://happycoding.io/tutorials/processing/)
> - The Processing Foundation  
> [https://processingfoundation.org/](https://processingfoundation.org/)  
> Check out the tabs.  
> In the education tab, there is a reference to the Coding Train.

`:)`

---

<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:** [April 18, 2020, 10:33am UTC](https://discourse.processing.org/t/quadrifolium-curve/19887/3 "2020-04-18T10:33:48Z")

</div>

Hello,

You are missing most of the plot:

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/7/71d41af1b2c140c0eff82e40fbd3984b1adfc276.png)

`:)`

---

<div class="post-metadata">

**Author:** ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)\
**Post date:** [April 18, 2020, 10:36am UTC](https://discourse.processing.org/t/quadrifolium-curve/19887/4 "2020-04-18T10:36:20Z")

</div>

Welcome to the forum. 😄

Is this homework?  
Are you a Civil Engineering student?

Before you draw the tangent you need to be able to draw the curve and your code has syntax errors so you can’t see anything. Change the cross method to

```auto
void cross(float x, float y ) {
  for (float t = 0; t < 600; t = t + 0.1) {
    point(x-300*sin(t)*sin(t)*cos(t), y-300*cos(t)*cos(t)*sin(t));
  }
}

```

> [@ElMatematico53](#):
>
> We would like to see the tangent line every time the mouse is on the function,

This is impossible to do using the implicit formula  
`(x^6)+(3x^4·y^2)+(3x^2·y^4)+(y^6)-(4a^2·x^2·y^2)=0`  
so use the two parametric equations  
`x = 2*a*sin^2(t)*cos(t)`  
`y = 2*a*cos^2(t)*sin(t)`  
Split this into two sub problems

1. For a given value of `t` calculate the position on the curve and the slope (angle) of the tangent.
2. Determine the value of `t` when the mouse is very close to the curve

Starting with (1)  
If we know `t` then we can use the parametric equations above to find the position `[x, y]` on the curve.  
To find the tangent angle you need to differentiate the parametric equations i.e.  
`x' = dx/dt = ???` and  
`y' = dy/dt = ???`  
??? = I leave the calculus to you

Let `dxt = x'` and `dyt = y'`  
The tangent angle is given by the formula  
angle = atan(-dyt / dxt)

That should be enough to get you started.

---

<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:** [April 18, 2020, 11:12am UTC](https://discourse.processing.org/t/quadrifolium-curve/19887/5 "2020-04-18T11:12:24Z")

</div>

This calls for a tutorial or blog post…

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [April 18, 2020, 6:30pm UTC](https://discourse.processing.org/t/quadrifolium-curve/19887/6 "2020-04-18T18:30:06Z")

</div>

We are seeing a _lot_ of tangent lines problems just lately. Interesting that there seem to be many different curves. I wonder where the exam is.