円弧でテセレーション(tessellation arc)

↓六角形充填
![out.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/44bc7b6d-a323-06c3-d7d8-0f3faad0ebd7.png)



















↓正方形充填
![out.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/23d0089a-5b1e-c115-364e-2eac3f11efae.png)














↓正方形＋菱形充填
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/756168c2-7462-5b9f-c85f-f9a592c756d5.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/8769efe2-a5a0-6571-5f97-85aba486e3fe.png)


























↓ペンローズタイル充填
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/afe8590a-3c41-f252-6ad2-decd036d2fb5.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/2c1becac-9324-19c4-62e7-eaefc47e70ed.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/82aeb542-994c-20cd-ba40-14d1e70ee800.png)
























↓三種充填
![hex_sq_tri_org.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/62b95cee-54d2-e685-6fbf-3ee6cbcfd70c.png)





















![hex_sq_tri_org_red.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/c8f23038-c945-19f9-e1fc-089653af7870.png)


















↓八角形
![octa_sq.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/b97d984c-9bbc-d609-ed80-8bd074416d0f.png)


















三角形と四角形regular
![sq30tri2regular.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/44401244-3d9b-0e17-47d6-70b71739aa31.png)













![_sq30tri2regular.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/f4e8c197-74b2-3d33-6934-edb38aa86ff4.png)













三角形と四角形random![sq30tri2random.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/65c68631-b1c6-0134-60ba-2a8e97704839.png)














# はじめに
円弧パターンで埋め尽くす模様をいろいろ試しました。

# 正方形充填
コードのみで描画可能。画像ファイル不要。
```java:Processing
PImage a, b;

void setup() {
  size(512, 512);
  background(255);
  //a = loadImage("a.png");
  //b = loadImage("b.png");

  noStroke();
  fill(0);
  ellipse(64, 64, 85, 85);
  ellipse(0, 0, 85, 85);
  ellipse(128, 0, 85, 85);
  fill(255);
  ellipse(0, 0, 43, 43);
  ellipse(128, 0, 43, 43);
  ellipse(64, 64, 43, 43);
  a = get(0, 0, 64, 64);
  b = get(64, 0, 64, 64);

  for (int y=0; y<512; y+=64) {
    for (int x=0; x<512; x+=64) {
      if (random(1)<0.5) {
        image(a, x, y);
      } else {
        image(b, x, y);
      }
    }
  }
  frameRate(15);
}

void draw() {
  int x = int(random(8))*64;
  int y = int(random(8))*64;
  if (random(1)<0.5) {
    image(a, x, y);
  } else {
    image(b, x, y);
  }
}
```


# 六角形充填
下記、svgファイルが必要。
```java:Processing
PShape a, b;

void setup() {
  size(800, 800);
  background(255);
  a = loadShape("a.svg");
  b = loadShape("b.svg");
  float w=120;
  float h=103.923;

  for (int y=0; y<800; y+=104) {
    for (int x=0; x<800; x+=90) {
      if(random(1)<0.5){
        shape(a, x, (x/90)%2*52 + y, w, h);
      }else{
        shape(b, x, (x/90)%2*52 + y, w, h);
      }
    }
  }
}

void draw() {
}
```

```xml:a.svg
<?xml version="1.0" encoding="UTF-8"?><svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 340.16 294.59"><g id="_レイヤー_1-2"><path d="M198.38,0h56.74l28.36,49.11" style="fill:none; stroke-width:0px;"/><path d="M28.36,196.41L0,147.29l28.36-49.11" style="fill:none; stroke-width:0px;"/><path d="M283.47,245.47l-28.36,49.11h-56.74" style="fill:none; stroke-width:0px;"/><path d="M28.36,196.41c16.95-9.82,28.38-28.15,28.38-49.11s-11.43-39.29-28.38-49.11L0,147.29l28.36,49.11Z" style="fill:#fff; stroke-width:0px;"/><path d="M198.38,294.59h56.74l28.36-49.11c-8.35-4.84-18.03-7.62-28.36-7.62-31.29,0-56.74,25.45-56.74,56.74Z" style="fill:#fff; stroke-width:0px;"/><path d="M198.38,0h0c0,31.29,25.45,56.74,56.74,56.74,10.33,0,20.01-2.79,28.36-7.63L255.12,0h-56.74Z" style="fill:#fff; stroke-width:0px;"/><path d="M255.12,181.25c20.62,0,39.98,5.54,56.66,15.21l28.38-49.16-28.38-49.16c-16.68,9.67-36.03,15.21-56.66,15.21C192.62,113.34,141.78,62.5,141.78,0h0s-56.74,0-56.74,0l-28.38,49.16c33.86,19.62,56.68,56.26,56.68,98.13s-22.82,78.51-56.68,98.13l28.38,49.16h56.74c0-62.5,50.84-113.34,113.34-113.34Z" style="fill:#fff; stroke-width:0px;"/><path d="M56.66,245.43l-28.3-49.02" style="fill:#000; stroke-width:0px;"/><path d="M28.36,98.18l28.3-49.02" style="fill:#000; stroke-width:0px;"/><path d="M113.34,147.29c0-41.87-22.82-78.51-56.68-98.13l-28.3,49.02c16.95,9.82,28.38,28.15,28.38,49.11s-11.43,39.29-28.38,49.11l28.3,49.02c33.86-19.62,56.68-56.26,56.68-98.13Z" style="fill:#000; stroke-width:0px;"/><path d="M311.78,196.45l-28.3,49.02" style="fill:#000; stroke-width:0px;"/><path d="M255.12,237.85c10.33,0,20.01,2.79,28.36,7.62l28.3-49.02c-16.68-9.67-36.03-15.21-56.66-15.21-62.5,0-113.34,50.84-113.34,113.34h56.6c0-31.29,25.45-56.74,56.74-56.74Z" style="fill:#000; stroke-width:0px;"/><path d="M283.47,49.11l28.3,49.02" style="fill:#000; stroke-width:0px;"/><path d="M255.12,113.34c20.62,0,39.98-5.54,56.66-15.21l-28.3-49.02c-8.35,4.84-18.03,7.63-28.36,7.63C223.83,56.74,198.38,31.29,198.38,0h0s-56.6,0-56.6,0h0c0,62.5,50.84,113.34,113.34,113.34Z" style="fill:#000; stroke-width:0px;"/></g></svg>
```

```xml:b.svg
<?xml version="1.0" encoding="UTF-8"?><svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 340.16 294.59"><g id="_レイヤー_1-2"><path d="M141.78,294.59h-56.74l-28.36-49.11" style="fill:none; stroke-width:0px;"/><path d="M311.8,98.18l28.36,49.11-28.36,49.11" style="fill:none; stroke-width:0px;"/><path d="M56.68,49.11L85.04,0h56.74" style="fill:none; stroke-width:0px;"/><path d="M311.8,98.18c-16.95,9.82-28.38,28.15-28.38,49.11s11.43,39.29,28.38,49.11l28.36-49.11-28.36-49.11Z" style="fill:#fff; stroke-width:0px;"/><path d="M141.78,0h-56.74l-28.36,49.11c8.35,4.84,18.03,7.62,28.36,7.62,31.29,0,56.74-25.45,56.74-56.74Z" style="fill:#fff; stroke-width:0px;"/><path d="M141.78,294.59h0c0-31.29-25.45-56.74-56.74-56.74-10.33,0-20.01,2.79-28.36,7.63l28.36,49.11h56.74Z" style="fill:#fff; stroke-width:0px;"/><path d="M85.04,113.34c-20.62,0-39.98-5.54-56.66-15.21L0,147.29l28.38,49.16c16.68-9.67,36.03-15.21,56.66-15.21,62.5,0,113.34,50.84,113.34,113.34h0s56.74,0,56.74,0l28.38-49.16c-33.86-19.62-56.68-56.26-56.68-98.13s22.82-78.51,56.68-98.13L255.12,0h-56.74c0,62.5-50.84,113.34-113.34,113.34Z" style="fill:#fff; stroke-width:0px;"/><path d="M283.5,49.16l28.3,49.02" style="fill:#000; stroke-width:0px;"/><path d="M311.8,196.41l-28.3,49.02" style="fill:#000; stroke-width:0px;"/><path d="M226.82,147.29c0,41.87,22.82,78.51,56.68,98.13l28.3-49.02c-16.95-9.82-28.38-28.15-28.38-49.11s11.43-39.29,28.38-49.11l-28.3-49.02c-33.86,19.62-56.68,56.26-56.68,98.13Z" style="fill:#000; stroke-width:0px;"/><path d="M28.38,98.13l28.3-49.02" style="fill:#000; stroke-width:0px;"/><path d="M85.04,56.74c-10.33,0-20.01-2.79-28.36-7.62l-28.3,49.02c16.68,9.67,36.03,15.21,56.66,15.21,62.5,0,113.34-50.84,113.34-113.34h-56.6c0,31.29-25.45,56.74-56.74,56.74Z" style="fill:#000; stroke-width:0px;"/><path d="M56.68,245.47l-28.3-49.02" style="fill:#000; stroke-width:0px;"/><path d="M85.04,181.25c-20.62,0-39.98,5.54-56.66,15.21l28.3,49.02c8.35-4.84,18.03-7.63,28.36-7.63,31.29,0,56.74,25.45,56.74,56.74h0s56.6,0,56.6,0h0c0-62.5-50.84-113.34-113.34-113.34Z" style="fill:#000; stroke-width:0px;"/></g></svg>
```


# 分銅つなぎ

```java:processing
size(1000, 1000);
background(255);
noFill();

for (int y=0; y<=1000; y+=100) {
  for (int x=0; x<=1000; x+=100) {
    arc(x+ 50, y+50, 100, 100,        PI, HALF_PI*3);
    arc(x    , y   , 100, 100, HALF_PI*3, TWO_PI   );
    arc(x+100, y   , 100, 100,   HALF_PI, PI       );
    arc(x+ 50, y+50, 100, 100,         0, HALF_PI  );
  }
}
```
![fundo.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/6774ae69-7945-1c7c-4d6b-f8ecfa128ce7.png)

# 参考サイト
ペンローズの作図をイラレでしたときに、参考になった。

https://www.num-kt.com/post/penrose