# How to make a bezier curver not start at top left corner when using mouseX, mouseY as the initial anchor point?

**URL:** https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912
**Category:** Coding Questions
**Tags:** homework
**Created:** [September 10, 2019, 12:46pm UTC](https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912 "2019-09-10T12:46:53Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![nathanchun](https://avatars.discourse-cdn.com/v4/letter/n/94ad74/32.png) [@nathanchun](https://discourse.processing.org/u/nathanchun)
#### Post date: [September 10, 2019, 12:46pm UTC](https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912/1 "2019-09-10T12:46:53Z")

</div>

I am new to processing and was assigned in class to create a bezier curve that makes one of the control points mouseX and mouseY along with some other necessary shapes needed for the assignment. Whenever I hit run, however, the control point I set to mouseX and mouseY automatically starts at the top left corner instead of where my mouse currently is on the screen. I have attached an image of the run window and and this is my code:

```auto
void setup() {
  size(500,500);
  background(255);
}

void draw() {
  noFill();
  stroke(175,238,218);
  strokeWeight(5);
  line(300, 300, 50, 400);
  line(350, 450, 400, 400);
  stroke(255, 0, 0);
  bezier(mouseX, mouseY, 50,400,350,450,400,400);  
}

```

I would like to know how to prevent the curve from starting at the top left corner like it keeps doing.

 ![hm1%20run](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/37740290aae115612862b4381f6d0e3fe7903dd1.png)

---

<div class="post-metadata">

### Author: ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)
#### Post date: [September 10, 2019, 1:10pm UTC](https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912/2 "2019-09-10T13:10:19Z")

</div>

possibly you wanted to use the mouse for play with control point (c2?) , and not for anchor point  
check again:  
[https://processing.org/reference/bezier\_.html](https://processing.org/reference/bezier_.html)

```auto
// https://processing.org/reference/bezier_.html
// https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912/2

// the anchor points define begin and end of the bezier curve
// the control points define the starting angle of the curve at the anchor points

void setup() {
  size(800, 800);
  noFill();
  strokeWeight(5);
}

PVector a1 = new PVector(300,300,0);
PVector c1 = new PVector( 50,400,0);
PVector c2 = new PVector(350,400,0);
PVector a2 = new PVector(350,450,0);

void draw() {
  background(200,200,0);
  c2.set(mouseX,mouseY,0);
  stroke(175, 238, 218);
  line(a1.x,a1.y,c1.x,c1.y);
  line(c2.x,c2.y,a2.x,a2.y);
  stroke(200, 0, 0);
  circle(c2.x,c2.y,5);
  bezier(a1.x,a1.y,c1.x,c1.y,c2.x,c2.y,a2.x,a2.y);
}

```

 ![bezier_comtrolpoint_mouse](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/1/19229b003bc7c4d544af34835071d6fdcff68483.png)

---

<div class="post-metadata">

### Author: ![nathanchun](https://avatars.discourse-cdn.com/v4/letter/n/94ad74/32.png) [@nathanchun](https://discourse.processing.org/u/nathanchun)
#### Post date: [September 10, 2019, 1:34pm UTC](https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912/3 "2019-09-10T13:34:15Z")

</div>

It’s not so much as choosing an anchor point or control point as the mouseX and mouseY, I just wanted to know if there was a way to prevent the shape from shooting up to the top left corner. Even if I make a control point the mouseX and mouseY instead of an anchor point, the curve starts at an upper left angle. I want the curve to start static, and then move as my mouse touches the window canvas. Does this make sense?

---

<div class="post-metadata">

### Author: ![Waboqueox](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/waboqueox/32/5643_2.png) [@Waboqueox](https://discourse.processing.org/u/Waboqueox)
#### Post date: [September 10, 2019, 1:41pm UTC](https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912/4 "2019-09-10T13:41:03Z")

</div>

maybe you can change the bezier when touch the screen, something like this:

```auto
boolean startMode = true;
float a1,b1,a2,b2,a3,b3,a4,b4;
void setup(){   
 size(500,500);
 background(255);
}

void draw(){
  background(0);
  noFill();
  stroke(175,238,218);
  strokeWeight(5);
  line(300, 300, 50, 400);
  line(350, 450, 400, 400);
  stroke(255, 0, 0);
  if(startMode)
    bezier( 300,300,100, 300,350,450,400,400);
  else
    bezier( 300,300,mouseX, mouseY,350,450,400,400);
}

void mousePressed(){
  startMode = false;
}

```

Well, adapt it to p5, but think that will works 😀😀

---

<div class="post-metadata">

### Author: ![nathanchun](https://avatars.discourse-cdn.com/v4/letter/n/94ad74/32.png) [@nathanchun](https://discourse.processing.org/u/nathanchun)
#### Post date: [September 10, 2019, 2:04pm UTC](https://discourse.processing.org/t/how-to-make-a-bezier-curver-not-start-at-top-left-corner-when-using-mousex-mousey-as-the-initial-anchor-point/13912/5 "2019-09-10T14:04:42Z")

</div>

yes this is what I was looking for!!! thank you so much
