# Help me please how to remove little circle?

**URL:** <https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564>\
**Category:** Coding Questions\
**Created:** [July 12, 2020, 9:04am UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564 "2020-07-12T09:04:48Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 12, 2020, 9:04am UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/1 "2020-07-12T09:04:48Z")

</div>

```auto
void setup() {
  size(640, 480);
  background(255);
}
void draw() {
  strokeWeight(10);
  stroke(255, 0, 0, 50);
  line(pmouseX, pmouseY, mouseX, mouseY);
}

```

---

<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:** [July 12, 2020, 12:49pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/2 "2020-07-12T12:49:15Z")

</div>

Hello,

Please format code when posting:  
[https://discourse.processing.org/faq#format-your-code](https://discourse.processing.org/faq#format-your-code)

You are setting the alpha (transparency) in your stroke:

```auto
stroke(v1, v2, v3, alpha)

```

References:  
[https://processing.org/tutorials/color/](https://processing.org/tutorials/color/)  
[https://processing.org/reference/stroke\_.html](https://processing.org/reference/stroke_.html)

`:)`

---

<div class="post-metadata">

**Author:** ![Spaceman1](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/spaceman1/32/9970_2.png) [@Spaceman1](https://discourse.processing.org/u/Spaceman1)\
**Post date:** [July 12, 2020, 2:21pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/3 "2020-07-12T14:21:35Z")

</div>

You can also try adding `strokeCap(SQUARE)` if you would like to keep the transparency.

---

<div class="post-metadata">

**Author:** ![furinax](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/furinax/32/9699_2.png) [@furinax](https://discourse.processing.org/u/furinax)\
**Post date:** [July 14, 2020, 5:05am UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/4 "2020-07-14T05:05:49Z")

</div>

As stated above, just remove the “, 50” from your call to “stroke” and it will be a solid, fully opaque circle.

---

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 14, 2020, 2:10pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/5 "2020-07-14T14:10:50Z")

</div>

i use alpha for transparency  
what i mean is how to delete the circle but stay transparent

---

<div class="post-metadata">

**Author:** ![Spaceman1](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/spaceman1/32/9970_2.png) [@Spaceman1](https://discourse.processing.org/u/Spaceman1)\
**Post date:** [July 15, 2020, 12:11am UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/6 "2020-07-15T00:11:22Z")

</div>

As I said before, if you use strokeCap(SQUARE) there is no issue. I think that the default stroke cap extends farther which results in an overlap in the two lines and a reduction in the transparency - which comes out looking like little circles. With the square cap there is practically no overlap.

---

<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:** [July 15, 2020, 12:55am UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/7 "2020-07-15T00:55:29Z")

</div>

Hello,

Like this?

My version:

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/348463793f1cf3d39bd31851a1a19b48d8e13832.png)

Your version:

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

`:)`

---

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 15, 2020, 12:31pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/8 "2020-07-15T12:31:28Z")

</div>

yeah, how to do that ?

---

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 15, 2020, 12:37pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/9 "2020-07-15T12:37:03Z")

</div>

but if you use strokeCAP (SQUARE), if the lines overlap colors will overlap too

---

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 15, 2020, 12:47pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/10 "2020-07-15T12:47:30Z")

</div>

if I place an image on it, will it remain transparent?

---

<div class="post-metadata">

**Author:** ![Spaceman1](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/spaceman1/32/9970_2.png) [@Spaceman1](https://discourse.processing.org/u/Spaceman1)\
**Post date:** [July 16, 2020, 5:27pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/11 "2020-07-16T17:27:16Z")

</div>

Yes that is true. My suggestion was just to limit the overlap, but by nature if you overlay two partly transparent lines it will become more opaque. The only thing I can think of is to store all the points and redraw them anew every frame testing to see if they overlap which sounds a little too compllicated. I wonder how @glv got it done?

---

<div class="post-metadata">

**Author:** ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)\
**Post date:** [July 16, 2020, 7:56pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/12 "2020-07-16T19:56:54Z")

</div>

I guess by not having it transparent 😁 and simply by changing the intensity of the color.

Edit:  
Actually it is possible with beginShape() and endShape():

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

---

<div class="post-metadata">

**Author:** ![qewer3322](https://avatars.discourse-cdn.com/v4/letter/q/e19adc/32.png) [@qewer3322](https://discourse.processing.org/u/qewer3322)\
**Post date:** [July 17, 2020, 2:30pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/13 "2020-07-17T14:30:05Z")

</div>

Hey! I’m not the one who asked the question but how exactly did you do it with beginShape() ?

---

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 17, 2020, 7:29pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/14 "2020-07-17T19:29:32Z")

</div>

yeah, maybe my question more difficult than I expected

---

<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:** [July 17, 2020, 10:41pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/15 "2020-07-17T22:41:40Z")

</div>

Hello,

Can you elaborate on what you are trying to achieve?

`:)`

---

<div class="post-metadata">

**Author:** ![Rai](https://avatars.discourse-cdn.com/v4/letter/r/67e7ee/32.png) [@Rai](https://discourse.processing.org/u/Rai)\
**Post date:** [July 18, 2020, 5:24am UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/16 "2020-07-18T05:24:56Z")

</div>

I just tried to draw lines with transparent colors without overlapping

---

<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:** [July 18, 2020, 11:02pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/17 "2020-07-18T23:02:48Z")

</div>

This is my initial exploration with beginShape()…

Took the original code and added code from here:  
[https://processing.org/reference/beginShape\_.html](https://processing.org/reference/beginShape_.html)

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

void draw() 
  {
  strokeWeight(10);
  stroke(255, 0, 0, 50);
  //line(pmouseX, pmouseY, mouseX, mouseY);
  
  beginShape(LINES);
  vertex(pmouseX, pmouseY);
  vertex(mouseX, mouseY);
  //vertex(30, 20);
  //vertex(85, 20);
  //vertex(85, 75);
  //vertex(30, 75);
  endShape(); 
  }

```

`:)`

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

---

<div class="post-metadata">

**Author:** ![qewer3322](https://avatars.discourse-cdn.com/v4/letter/q/e19adc/32.png) [@qewer3322](https://discourse.processing.org/u/qewer3322)\
**Post date:** [July 19, 2020, 1:39pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/18 "2020-07-19T13:39:24Z")

</div>

That works but the colors are still overlapping. I wonder how @jb4x did it. I’ll try some stuff too.

---

<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:** [July 19, 2020, 2:07pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/19 "2020-07-19T14:07:11Z")

</div>

Hello,

I used PGraphics for this example:

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

I created a PGraphics image and tinted it:  
[https://processing.org/reference/tint\_.html](https://processing.org/reference/tint_.html)  
[https://processing.org/reference/PGraphics.html](https://processing.org/reference/PGraphics.html)

Here is a “template” (see references) but not the complete code:

```auto
PGraphics pg;

void setup() 
  {
  size(640, 480);
  pg = createGraphics(width, height);
  
  textSize(130);
  textAlign(CENTER, CENTER);
  }

void draw() 
  {
  background(200);   
  text("TOP", width/2, height/3);
 
  pg.beginDraw();
 // It should be a simple exercise to integrate original code here
  pg.endDraw();

  // See tint() reference
  //tint(?, ?);
  image(pg, 0, 0); 

  text("BOT", width/2, 2*height/3);
  }

```

This is just an exploration of this topic.

`:)`

---

<div class="post-metadata">

**Author:** ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)\
**Post date:** [July 19, 2020, 2:22pm UTC](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564/20 "2020-07-19T14:22:26Z")

</div>

Thats the code I used:

```auto
ArrayList<PVector> pts = new ArrayList<PVector>();
final float minDist = 10;

void setup() {
  size(640, 480);
  background(255);
  
  strokeWeight(10);
  stroke(255, 0, 0, 50);
  
  pts.add(new PVector(0, 0));
}

void draw() {
  int lastPt = pts.size() - 1;
  if (dist(pts.get(lastPt).x, pts.get(lastPt).y, mouseX, mouseY) > minDist) {
    pts.add(new PVector(mouseX, mouseY));
  }
  
  background(255);
  
  beginShape();
  for (int i = 0; i < pts.size(); i++) {
    vertex(pts.get(i).x, pts.get(i).y);
  }
  endShape();
}

```

[Next page](https://discourse.processing.org/t/help-me-please-how-to-remove-little-circle/22564.md?page=2)