processing / processing/processing4

Add arcVertex() function to create circles arc using vertices.

オープン
#310 コメント 16 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

core enhancement
主要言語
Java
スター
494
フォーク
183
平均マージ
4時間 39分
マージ済み PR(30日)
3

説明

Created by: jb4xx

I feel like processing could use a function that easily generate arc circles to construct PShapes.

My proposal would be to use a bezier approximation of a circle and use the already existing bezierVertex() function to create an arc.
The argument list of the function could be similar to the one use for the arc() function to keep the same logic.

Here is what the function could look like:

/**
* Use bezierVertex to approximate an arc 
* The expected parameters are similar to the one found in the arc() function
* Since it uses bezierVertex to approximate an arc, it must be prefaced with a call to vertex() to set the first anchor point of the arc.
*
* @param  cx        x-coordinate of the center of the arc
* @param  cy        y-coordinate of the center of the arc
* @param  r         radius of the arc
* @param  a1        angle to start the arc, specified in radians
* @param  a2        angle to stop the arc, specified in radians
* @param  rotation  the direction in which to draw the arc. 1 for clockwise. -1 for counterclockwise
*/
void arcVertex(float cx, float cy, float r, float a1, float a2, int rotation) {
  a1 = a1 % TWO_PI;
  a2 = a2 % TWO_PI;
  float angleSpan;
  if (rotation == 1) {
    angleSpan = ((a2 - a1) % TWO_PI + TWO_PI) % TWO_PI;
  } else {
    rotation = -1;
    angleSpan = ((a1 - a2) % TWO_PI + TWO_PI) % TWO_PI;
  }

  int nbOfExtraPts = (int)(angleSpan / HALF_PI);
  float angleStep = angleSpan / (nbOfExtraPts + 1);

  ArrayList<PVector> anchorPts = new ArrayList<PVector>();
  anchorPts.add(new PVector(cx + r * cos(a1), cy + r * sin(a1)));
  for (int i = 0; i < nbOfExtraPts; i++) {
    anchorPts.add(new PVector(cx + r * cos(a1 + rotation * (i + 1) * angleStep), cy + r * sin(a1 + rotation * (i + 1) * angleStep)));
  }
  anchorPts.add(new PVector(cx + r * cos(a2), cy + r * sin(a2)));

  for (int i = 0; i < anchorPts.size() - 1; i++) {
    PVector start = anchorPts.get(i);
    PVector end = anchorPts.get(i + 1);

    float ax = start.x - cx;
    float ay = start.y - cy;

    float bx = end.x - cx;
    float by = end.y - cy;

    float q1 = ax * ax + ay * ay;
    float q2 = q1 + ax * bx + ay * by;
    float k2 = (4/3.0) * (sqrt(2 * q1 * q2) - q2) / (ax * by - ay * bx);

    float x2 = cx + ax - k2 * ay;
    float y2 = cy + ay + k2 * ax;
    float x3 = cx + bx + k2 * by;                              
    float y3 = cy + by - k2 * bx;

    bezierVertex(x2, y2, x3, y3, end.x, end.y);
  }
}

And here is a possible use case:

final float cx = 300;                   // x-coordinate of the center of the arc
final float cy = 300;                   // y-coordinate of the center of the arc
final float r1 = 150;                   // 1st radius
final float r2 = 250;                   // 2nd radius
final float startAngle = QUARTER_PI;    // Angle at which to start drawing the arc
final float stopAngle = 3 * QUARTER_PI; // Angle at which to stop drawing the arc


void setup() {
 size(600, 600);
 background(20);
 
 // Define style
 noFill();
 stroke(230);
 strokeWeight(4);
 
 // Draw the shape
 beginShape();
 vertex(cx + r1 * cos(startAngle), cy + r1 * sin(startAngle));
 arcVertex(cx, cy, r1, startAngle, stopAngle, 1);
 vertex(cx + r2 * cos(stopAngle), cy + r2 * sin(stopAngle));
 arcVertex(cx, cy, r2, stopAngle, startAngle, -1);
 vertex(cx + r1 * cos(startAngle), cy + r1 * sin(startAngle));
 endShape();

}

/**
* Use bezierVertex to approximate an arc 
* The expected parameters are similar to the one found in the arc() function
* Since it uses bezierVertex to approximate an arc, it must be prefaced with a call to vertex() to set the first anchor point of the arc.
*
* @param  cx        x-coordinate of the center of the arc
* @param  cy        y-coordinate of the center of the arc
* @param  r         radius of the arc
* @param  a1        angle to start the arc, specified in radians
* @param  a2        angle to stop the arc, specified in radians
* @param  rotation  the direction in which to draw the arc. 1 for clockwise. -1 for counterclockwise
*/
void arcVertex(float cx, float cy, float r, float a1, float a2, int rotation) {
 a1 = a1 % TWO_PI;
 a2 = a2 % TWO_PI;
 float angleSpan;
 if (rotation == 1) {
   angleSpan = ((a2 - a1) % TWO_PI + TWO_PI) % TWO_PI;
 } else {
   rotation = -1;
   angleSpan = ((a1 - a2) % TWO_PI + TWO_PI) % TWO_PI;
 }

 int nbOfExtraPts = (int)(angleSpan / HALF_PI);
 float angleStep = angleSpan / (nbOfExtraPts + 1);

 ArrayList<PVector> anchorPts = new ArrayList<PVector>();
 anchorPts.add(new PVector(cx + r * cos(a1), cy + r * sin(a1)));
 for (int i = 0; i < nbOfExtraPts; i++) {
   anchorPts.add(new PVector(cx + r * cos(a1 + rotation * (i + 1) * angleStep), cy + r * sin(a1 + rotation * (i + 1) * angleStep)));
 }
 anchorPts.add(new PVector(cx + r * cos(a2), cy + r * sin(a2)));

 for (int i = 0; i < anchorPts.size() - 1; i++) {
   PVector start = anchorPts.get(i);
   PVector end = anchorPts.get(i + 1);

   float ax = start.x - cx;
   float ay = start.y - cy;

   float bx = end.x - cx;
   float by = end.y - cy;

   float q1 = ax * ax + ay * ay;
   float q2 = q1 + ax * bx + ay * by;
   float k2 = (4/3.0) * (sqrt(2 * q1 * q2) - q2) / (ax * by - ay * bx);

   float x2 = cx + ax - k2 * ay;
   float y2 = cy + ay + k2 * ax;
   float x3 = cx + bx + k2 * by;                              
   float y3 = cy + by - k2 * bx;

   bezierVertex(x2, y2, x3, y3, end.x, end.y);
 }
}

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

Issue にはソースファイルもテストも記載されていません。まず、arcVertex() に提案されている動作を既存のエントリーポイントである arc() および bezierVertex() と比較し、次に beginShape() と endShape() の間で PShapes がどのように構築されるかを追跡してください。完了には、maintainer が承認した API 設計と、説明されたユースケースに対する arc 構築の検証が必要です。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
java
領域
computer-graphics
issue の種類
機能追加
難易度
5/5
見積もり時間
1週間以上
活発さ
停滞
明瞭さ
説明が足りない
初心者へのやさしさ
25/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。