扇状の描画位置指定方法について

Question

前提・実現したいこと

ご指摘があった為、修正し改めて質問をさせて頂きます。
Processingで木の枝にMinimライブラリを使って大きさを変化させた円を描画させるプログラムを作っています。
円の描画位置は下図のように木の枝の先に木の実がくっ付いている様に見えるイメージを考えています。
※ペイント３Dで編集した画像の為、該当のソースコードの実行画面ではありません。

発生している問題・エラーメッセージ

randomを使って指定範囲内で円の描画をさせていますが、この方法では四角形になってしまい木の枝以外の場所にも円が描画されてしまう。

該当のソースコード

※該当のソースコードはMinimを抜いたサンプルプログラムです。

float x;
float y;

void setup() {
  fullScreen();
  smooth();
  frameRate(10);
  colorMode(HSB, 360, 100, 100, 200);

  Tree(30, width/2, height, PI, width/6);  //木の太さ・描画位置,PI=π 180°

}

void draw() {
  x = random(650, 1250); //横
  y = random(200, 300); //縦
  noStroke();
  fill(random(255), random(255), random(255), 50);
  ellipse(x,y,10,10);

  fill(#959592);
  rect(0, 1030, 2000, 50);
}

//木の生成
void Tree(float strokeWeight, float x, float y, float rotate, float length) {
  pushMatrix();  //座標を一時保存
  translate(x, y);  //座標移動
  rotate(rotate);  //座標回転
  strokeWeight(strokeWeight);  //線の輪郭線の太さ
  stroke(#64482A);  //線の色
  line(0, 0, 0, length);  //線の描画,配列の長さ
  popMatrix();  //変更した座標を元に戻す
  if (strokeWeight<2)return;
  if (x%5>3 && strokeWeight<3)return;
  Tree(strokeWeight*2/3, x-sin(rotate)*length, y+cos(rotate)*length, rotate-PI/10, length*2/3);
  Tree(strokeWeight*2/3, x-sin(rotate)*length, y+cos(rotate)*length, rotate+PI/10, length*2/3);
}

補足情報（FW/ツールのバージョンなど）

Processing 3.5.3

Comments

[thkana]

発生している問題・エラーメッセージの欄を```で囲むのは、そこに画面上に現れたテキストをそのまま貼った時に表示が乱れないためです。現象をあなたが記述するのなら```で囲む意味はありません。今回は、そこを囲ってしまったために、マークダウン表記がそのまま表示されてしまって、質問に表示されていません(質問を投稿した後自分で見返していないのですか?)。

> 違和感が無いように木の形に合わせた位置
ではあまりに抽象的で分かりかねます。「こうしたい」というのが図で、手描きでいいのであると意図が伝わるんじゃないかと思います。

> Minimライブラリを使って大きさを変化させた円を描画させる
Minimは「音」を扱うためのライブラリです。Minimによって音を解析したデータによって描画を変えるということではあるのでしょうがしかし円の描画には直接関係ありません。情報を削ぎすぎて必要なところが書いてないよりはいいんですけれど、さすがにMinimは関係ないので、余計なところを削いだ(でも動く)サンプルプログラムにしていただけませんか。

[msw]

質問を修正しました。発生している問題の欄の```を削除しましたが、画像は表示されいるでしょうか？

Answer 1

とりあえず、梢の先の位置を保持して、なんとかならないか、と考えてみて

・準備
冒頭に変数を追加

float minx, maxx;
float miny, maxy;
ArrayList<PVector> bow=new ArrayList<PVector>();

Tree関数を

void Tree(float strokeWeight, float x, float y, float rotate, float length) {
  pushMatrix();  //座標を一時保存
  translate(x, y);  //座標移動
  rotate(rotate);  //座標回転
  strokeWeight(strokeWeight);  //線の輪郭線の太さ
  stroke(#64482A);  //線の色
  line(0, 0, 0, length);  //線の描画,配列の長さ
  popMatrix();  //変更した座標を元に戻す
  if (strokeWeight<2 || x%5>3 && strokeWeight<3) {
    float xx=x-sin(rotate)*length;
    float yy=y+cos(rotate)*length;
    if (xx<minx) {
      minx=xx;
    }
    if (xx>maxx) {
      maxx=xx;
    }
    if (yy<miny) {
      miny=yy;
    }
    if (yy>maxy) {
      maxy=yy;
    }
    PVector endp=new PVector(xx, yy);
    bow.add(endp);
    return;
  }
  Tree(strokeWeight*2/3, x-sin(rotate)*length, y+cos(rotate)*length, rotate-PI/10, length*2/3);
  Tree(strokeWeight*2/3, x-sin(rotate)*length, y+cos(rotate)*length, rotate+PI/10, length*2/3);
}

としてみる。その上で...

・試作1

void draw() {
EXIT:
  while (true) {
    x = random(minx, maxx); //横
    y = random(miny, maxy); //縦
    for (PVector p : bow) {
      if (dist(x, y, p.x, p.y )<20) {

        noStroke();
        fill(random(255), random(255), random(255), 50);
        ellipse(x, y, 10, 10);

        break EXIT;
      }
    }
  }
  fill(#959592);
  rect(0, 1030, 2000, 50);
}

おおよそ梢のあたりでランダムに生成した点がいずれかの梢の末端から距離20以内だったら描画する、としてみた。
どうでしょうね。

---

改善案
乱数で「ハズレだったらもう一度」方式は、現実的には大丈夫だけどリクツの上では「永遠に欲しい値が得られない」という可能性があるので、あまり気持ちよくない。
「梢の一つを乱数で選んで、そこから半径20の範囲のどこかに円を描く」に変えてみる。実用上ほぼ変わらないけれど。
それと全く質問に関係ない変更をひとつ。

void draw() {
  int n=(int)random(0, bow.size());
  float r=random(0, 20);
  float th=random(0, PI*2);
  x=bow.get(n).x+r*cos(th);
  y=bow.get(n).y+r*sin(th);

  noStroke();
  colorMode(HSB,255,255,255,100);
  fill(random(255), 255, 255, 50);//HSBでこうした方が色が華やかになるかな
  ellipse(x, y, 10, 10);
  colorMode(ARGB);

  fill(#959592);
  rect(0, 1030, 2000, 50);
}