半径が乱数の円

# 半径が乱数の円
半径が一定ではない、乱数で定義される円を考える。

```java
size(512, 512);
background(255);
translate(256, 256);

//半径の配列を作成
float r[] = new float[360];
r[0] = 200;
for (int th=1; th<360; th++) {
  r[th] = r[th-1]+random(-1, 1);
}

//円描画
for (int th=0; th<359; th++) {
  float x1 = r[th] * cos(radians(th));
  float y1 = r[th] * sin(radians(th));
  float x2 = r[th+1] * cos(radians(th+1));
  float y2 = r[th+1] * sin(radians(th+1));
  line(x1, y1, x2, y2);
}
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/77207290-57d0-1554-602c-d548e5648513.png)

始点と終点でズレが生じるので、補正する。

```java
size(512, 512);
background(255);
translate(256, 256);

//半径の配列を作成
float r[] = new float[360];
r[0] = 200;
for (int th=1; th<360; th++) {
  r[th] = r[th-1]+random(-1, 1);
}
//補正
float t = (r[359]-200)/360.0;
for (int th=1; th<360; th++) {
  r[th] -= t*th;
}

//円描画
float x1,y1,x2,y2;
for (int th=0; th<359; th++) {
  x1 = r[th] * cos(radians(th));
  y1 = r[th] * sin(radians(th));
  x2 = r[th+1] * cos(radians(th+1));
  y2 = r[th+1] * sin(radians(th+1));
  line(x1, y1, x2, y2);
}
//始点と終点
x1 = r[359] * cos(radians(359));
y1 = r[359] * sin(radians(359));
x2 = r[0] * cos(radians(0));
y2 = r[0] * sin(radians(0));
line(x1, y1, x2, y2);
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/81ef1623-cc74-48b0-280c-65a03bd92d1a.png)

乱数をperlinノイズに置き換える

```java
size(512, 512);
background(255);
translate(256, 256);

//半径の配列を作成
float r[] = new float[360];
for (int th=0; th<360; th++) {
  r[th] = 200+noise(th*0.5)*8.0;
}
//補正
float t = (r[359]-r[0])/360.0;
for (int th=0; th<360; th++) {
  r[th] -= t*th;
}

//円描画
float x1,y1,x2,y2;
for (int th=0; th<359; th++) {
  x1 = r[th] * cos(radians(th));
  y1 = r[th] * sin(radians(th));
  x2 = r[th+1] * cos(radians(th+1));
  y2 = r[th+1] * sin(radians(th+1));
  line(x1, y1, x2, y2);
}
//始点と終点
x1 = r[359] * cos(radians(359));
y1 = r[359] * sin(radians(359));
x2 = r[0] * cos(radians(0));
y2 = r[0] * sin(radians(0));
line(x1, y1, x2, y2);
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/671fc4de-4978-d6b5-ba05-c094dd1def13.png)

20週、半径を縮めながら、半透明で描画
```java
size(512, 512);
background(255);
translate(256, 256);
stroke(0,99);

//半径の配列を作成
float r[] = new float[7200];
for (int th=0; th<7200; th++) {
  r[th] = 200+noise(th*0.2)*10.0-th*0.015;
}

//円描画
float x1,y1,x2,y2;
for (int th=0; th<7199; th++) {
  x1 = r[th] * cos(radians(th));
  y1 = r[th] * sin(radians(th));
  x2 = r[th+1] * cos(radians(th+1));
  y2 = r[th+1] * sin(radians(th+1));
  line(x1, y1, x2, y2);
}
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/52e7825f-1635-146e-1954-b56d54dcefe7.png)

フリーハンドで、円を100回ぐるぐる書いたような表現。
noiseのバランス難しい。

```java
size(512, 512);
background(255);
translate(256, 256);
stroke(0,10);

//半径の配列を作成
float r[] = new float[36000];
for (int th=0; th<36000; th++) {
  r[th] = 200+noise(th*0.04)*50.0;
}

//円描画
float x1,y1,x2,y2;
for (int th=0; th<36000-1; th++) {
  x1 = r[th] * cos(radians(th));
  y1 = r[th] * sin(radians(th));
  x2 = r[th+1] * cos(radians(th+1));
  y2 = r[th+1] * sin(radians(th+1));
  line(x1, y1, x2, y2);
}
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/550f622b-ef62-e02d-3c16-948ff9b0d5bc.png)

直線同士の接続部分が濃くなってしまうので、curveに置き換える。
が、パラメータによってはあまり関係なかった。

```java
size(512, 512);
background(255);
translate(256, 256);
strokeWeight(0.4);
noFill();

//半径の配列を作成
float r[] = new float[3600];
for (int th=0; th<3600; th++) {
  r[th] = 200+noise(th*0.04)*60.0;
}

//円描画
beginShape();
float x, y;
for (int th=0; th<3600; th+=4) {
  x = r[th] * cos(radians(th));
  y = r[th] * sin(radians(th));
  curveVertex(x, y);
}
endShape();

```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/23126e3b-6ab2-66b1-3e7d-57234604dd05.png)

これで、フォントをなぞりたい