結論
こんな感じでいいのでしょうか?
Processing
1ArrayList <PVector> circles;
2
3void setup() {
4 background(0,0,100);
5 size(600, 600);
6
7 //色相・彩度・明度で指定
8 colorMode(RGB, 256, 256, 256);
9 smooth();
10 noLoop();
11}
12
13void draw() {
14 for ( int n = 1; n <= 10; ++n ) {
15 background(255,255,255);
16 circles = new ArrayList <PVector>();
17
18 addCircle();
19
20 for (int i=0; i<circles.size(); i++) {
21 PVector p = circles.get(i);
22 noStroke();
23 fill( 0,0,0);
24 ellipse(p.x, p.y, p.z, p.z);
25 }
26
27 // ファイルの保存はすべての描画が終わってから
28 save(String.format(""E:/processing/a%03d.png",n));
29 }
30}
31
32
33void addCircle() {
34 //10は個数
35 while (circles.size() <30) {
36 //大きさが10から100の間
37 float diameter =random(10,100);
38 PVector c = new PVector(random(width), random(height), diameter);
39 boolean overlapping = false;
40
41 for (PVector p : circles) {
42
43 /*
44 distは2点間の距離を出す dist(x1, y1, x2, y2)
45 この場合は、cとpの2点間の距離 > cの半径+pの半径の場合に描画される
46 cとpの2点間の距離 < cの半径+pの半径の場合は重なってしまう
47 */
48
49 if (dist(c.x, c.y, p.x, p.y) < (c.z + p.z)) {
50 overlapping = true;
51 break;
52 }
53 }
54
55 if (!overlapping) {
56 //配列の要素を追加
57 circles.add(c);
58 }
59 }
60
61}
説明
・複数の大きさの円を描画できない(サイトではランダムに大きさを変更できているのですが大きさを2つ以上指定する方法がわかりません)
座標の生成につかわれている random メソッドで、サイズも生成させればいいのではないでしょうか?
Processing
1//大きさが10から100の間
2float diameter = random(10,100);
3PVector c = new PVector(random(width), random(height), diameter);
・実行するとprocessing上では円の描画された画像が出てくるがエクスプローラーからフォルダ内を見てみると白いだけで円が描画されていない画像が保存されている。
ご質問のコードでは、円を描画する前にファイルの書き出しを行っています。
save を draw メソッドの最後に移して、全ての描画が終わった後で、ファイルを書きだすようにすれば、ファイルの内容と画面の表示が一致するはずです。
・サイトではクリックすると円の位置を変更できるがクリックせずに複数画像を同時に作りたい
draw の描画処理全体を以下のようにループで囲ってファイル名を変えてセーブすればできると思います。
Processing
1void draw() {
2 for ( int n = 1; n < 10; ++n ) {
3~中略~
4 // 最後に画像を保存
5 save(String.format(""E:/processing/a%03d.png",n));
6 }
7}
コメントで追加いただいた仕様について
例えば、サイズ10 20 30の3種類の大きさの円をそれぞれ10個 10個 5個の様に個数を指定して場所だけランダムにしたいです。
こんな感じでしょうか。
Processing
1ArrayList <PVector> circles;
2
3public class CircleDefine {
4 public int size;
5 public int count;
6
7 public CircleDefine( int size, int count ) {
8 this.size = size;
9 this.count = count;
10 }
11}
12ArrayList<CircleDefine> circle_defines = new ArrayList<CircleDefine>();
13
14void setup() {
15 background(0,0,100);
16 size(600, 600);
17
18 //色相・彩度・明度で指定
19 colorMode(RGB, 256, 256, 256);
20
21 // 円のサイズと数を指定
22 circle_defines.add(new CircleDefine(30,5));
23 circle_defines.add(new CircleDefine(10,10));
24 circle_defines.add(new CircleDefine(20,10));
25
26 smooth();
27 noLoop();
28}
29
30void draw() {
31 for ( int n = 1; n <= 10; ++n ) {
32 background(255,255,255);
33 circles = new ArrayList <PVector>();
34
35 addCircle();
36
37 for (int i=0; i<circles.size(); i++) {
38 PVector p = circles.get(i);
39 noStroke();
40 fill( 0,0,0);
41 ellipse(p.x, p.y, p.z, p.z);
42 }
43
44 // ファイルの保存はすべての描画が終わってから
45// save(String.format("E:/processing/a%03d.png",n));
46 save(String.format("C:/tmp/a%03d.png",n));
47 }
48}
49
50
51void addCircle() {
52
53 for ( CircleDefine circle_define : circle_defines ) {
54 int next_count = circles.size() + circle_define.count;
55 while (circles.size() < next_count ) {
56
57 PVector c = new PVector(random(width), random(height), circle_define.size);
58 boolean overlapping = false;
59
60 for (PVector p : circles) {
61
62 /*
63 distは2点間の距離を出す dist(x1, y1, x2, y2)
64 この場合は、cとpの2点間の距離 > cの半径+pの半径の場合に描画される
65 cとpの2点間の距離 < cの半径+pの半径の場合は重なってしまう
66 */
67
68 if (dist(c.x, c.y, p.x, p.y) < (c.z + p.z)) {
69 overlapping = true;
70 break;
71 }
72 }
73
74 if (!overlapping) {
75 //配列の要素を追加
76 circles.add(c);
77 }
78 }
79 }
80
81}
基本的な考え方としては、作りたい円の定義をあらかじめ変数に入れて用意しておき、
描画時にそれを順に取り出して描画していきます。
以下の例ではクラスを新たに作っていますが、以下のように配列を二つ作ってしまったほうが早いかもしれません。
processing
1int[] size = { 10, 20, 30 };
2int[] count = { 10, 10, 5 };