質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Processing

Processingは、オープンソースプロジェクトによるCGのためのプログラミング言語です。Javaをベースにしており、グラフィック機能に特化しています。イメージの生成やアニメーションなど、視覚的なフィードバックを簡単に得ることが可能です。

Q&A

解決済

1回答

527閲覧

円が同じ動きをしてしまう

msw

総合スコア9

Processing

Processingは、オープンソースプロジェクトによるCGのためのプログラミング言語です。Javaをベースにしており、グラフィック機能に特化しています。イメージの生成やアニメーションなど、視覚的なフィードバックを簡単に得ることが可能です。

1グッド

0クリップ

投稿2019/12/07 09:47

編集2019/12/07 10:45

前提・実現したいこと

・親の円を無くして子供の円だけにした場合を作り、どちらが見栄えが良いか比較したいと考えた。
円の処理の手順
1.実行時に円を5個程度指定した場所に描画する。
2.次の処理で弾ける様に表現する為に、指定した場所ごとに円を10個程度同じ場所に描画する。
3.マウスクリックで全ての円が物理演算で動き出し、やがて下に落ちて溜まっていく。
4.さらにクリックしても追加の円は描画せず、単純に下に溜まっている円が再び動くだけにする。
5.いちいちプログラムを閉じなくても良い様に、クリックまたはキー操作で描画をリセットをする。
※最終的に手を加えなければ下に円が溜まり、初期位置には何も描画されていないという絵にしたい。

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

単純に位置をずらしたellipseを増やすと、増やした数だけ横に連なって同じ動きをしてしまう。 例えば、実行時に描画する円を5個増やした場合は位置のずれた5つの円が描画される。←ここまでは良し しかし、クリックすると横に5個連なった円の塊が10個動き出してしまう。←原因不明 何故横に連なってしまうのか分かりませんが、とにかくバラバラに動いて欲しいです。 他にも問題が発生しなんとか自己解決しましたが、どうしてもこの問題だけ分かりませんでした。すみません。 ※該当のソースコードはプログラム全てでは無く、問題解決に必要であろう部分のみ載せています。  ご要望があれば、追記で全体のプログラムを載せます。宜しくお願い致します。

該当のソースコード

processing

1import ddf.minim.*; 2import ddf.minim.analysis.*; 3import ddf.minim.effects.*; 4import ddf.minim.signals.*; 5import ddf.minim.spi.*; 6import ddf.minim.ugens.*; 7 8Minim minim; 9AudioPlayer player; 10float playerIn; 11float x; 12float y; 13int buffersize = 512; 14 15int NUM = 10; //パーティクルの数 16//パーティクルを格納する配列 17ParticleVec2[] particles = new ParticleVec2[NUM]; 18 19void setup() { 20 fullScreen(); 21 smooth(); 22 frameRate(60); 23 colorMode(HSB, 360, 100, 100, 100); 24 25 minim = new Minim(this); 26 player = minim.loadFile("Mountain.mp3"); 27 player.loop(); 28 29 for (int i = 0; i < NUM; i++) { 30 particles[i] = new ParticleVec2(); 31 particles[i].location.set(width/2.0, height/2.3); 32 } 33} 34 35void draw() { 36 //背景をフェードさせる 37 fill(0, 30); 38 rect(0, 0, width, height); 39 fill(100); 40 41 //木 42 colorMode(RGB); 43 Tree(30, width/2, height, PI, width/8); 44 45 //パーティクルの位置を更新して描画 46 for (int i = 0; i < NUM; i++) { 47 particles[i].update(); 48 particles[i].draw(); 49 particles[i].bounceOffWalls(); 50 } 51 52 //地面 53 fill(#959592); 54 rect(0, 1030, 2000, 50); 55} 56 57//木の生成 58void Tree(float strokeWeight, float x, float y, float rotate, float length) { 59 pushMatrix(); //座標を一時保存 60 translate(x, y); //座標移動 61 rotate(rotate); //座標回転 62 strokeWeight(strokeWeight); //線の輪郭線の太さ 63 stroke(#E57409); //線の色 64 line(0, 0, 0, length); //線の描画,配列の長さ 65 popMatrix(); //変更した座標を元に戻す 66 if (strokeWeight<2)return; 67 if (x%5>3 && strokeWeight<3)return; 68 Tree(strokeWeight*2/3, x-sin(rotate)*length, y+cos(rotate)*length, rotate-PI/10, length*2/3); 69 Tree(strokeWeight*2/3, x-sin(rotate)*length, y+cos(rotate)*length, rotate+PI/10, length*2/3); 70} 71 72void mouseClicked() { 73 //パーティクルの数だけくりかえし 74 for (int i = 0; i < NUM; i++) { 75 76 //ランダムに加速度を設定 - ランダムの範囲を中央からの距離に 77 float angle = random(PI * 2.0); 78 float length = random(20); 79 float posX = cos(angle) * length; 80 float posY = sin(angle) * length; 81 particles[i].acceleration.set(posX, posY); 82 //下向きに0.1の重力 83 particles[i].gravity.set(0.0, 0.1); 84 //摩擦を0.01に 85 particles[i].friction = 0.01; 86 PVector force = new PVector(cos(angle) * length, sin(angle) * length); 87 particles[i].addForce(force); 88 } 89} 90 91void keyPressed(){ 92 for (int i = 0; i < NUM; i++) { 93 particles[i] = new ParticleVec2(); 94 particles[i].location.set(width/2.0, height/2.3); 95 } 96} 97 98void stop() { 99 minim.stop(); 100 super.stop(); 101} 102 103 104 // ↑メイン ↓物理演算 105 106 107// 物体の運動を計算(運動方程式) 108class ParticleVec2 { 109 PVector location; // 位置 110 PVector velocity; // 速度 111 PVector acceleration; // 加速度 112 PVector gravity; // 重力 113 float mass; // 質量 114 float friction; // 摩擦力 115 PVector min; // 稼動範囲(min) 116 PVector max; // 稼動範囲(max) 117 float radius; // パーティクル半径 118 // コンストラクタ 119 ParticleVec2() { 120 radius = 4.0; 121 mass = 1.0; // 質量は1.0に設定する 122 friction = 0.01; // 摩擦力を0.01に設定する 123 // 位置、速度、加速度を初期化する 124 location = new PVector(0.0, 0.0); 125 velocity = new PVector(0.0, 0.0); 126 acceleration = new PVector(0.0, 0.0); 127 gravity = new PVector(0.0, 0.0); // 重力なし 128 // 稼動範囲を設定する 129 min = new PVector(0.0, 0.0); 130 max = new PVector(width, height); 131 } 132 // 運動方程式から位置を更新 133 void update() { 134 acceleration.add(gravity); // 重力を加える 135 velocity.add(acceleration); // 加速度から速度を算出する 136 velocity.mult(1.0 - friction); // 摩擦力から速度を変化させる 137 location.add(velocity); // 速度から位置を算出する 138 acceleration.set(0, 0); // 加速度を0にリセット(等速運動)する 139 } 140 141 //問題の部分↓ 142 void draw() { 143 playerIn = player.mix.level()*200; //minimを使って円の大きさと色を変えています 144 noStroke(); 145 fill(random(255), random(255), random(255), 255); 146 147 ellipse(location.x, location.y, playerIn, playerIn); 148 //translate(location.x/1.4,location.y/2);//位置はずれたが同じ動きでバウンド位置もずれる 149 //ellipse(location.x, location.y, playerIn, playerIn); 150 151 } 152 153 154 // 壁でバウンドさせる 155 void bounceOffWalls() { 156 if (location.x > max.x) { 157 location.x = max.x; 158 velocity.x *= -1; 159 } 160 if (location.x < min.x) { 161 location.x = min.x; 162 velocity.x *= -1; 163 } 164 if (location.y > max.y) { 165 location.y = max.y; 166 velocity.y *= -1; 167 } 168 if (location.y < min.y) { 169 location.y = min.y; 170 velocity.y *= -1; 171 } 172 } 173 // 壁を突き抜けて反対から出現させる 174 void throughWalls() { 175 if (location.x < min.x) { 176 location.x = max.x; 177 } 178 if (location.y < min.y) { 179 location.y = max.y; 180 } 181 if (location.x > max.x) { 182 location.x = min.x; 183 } 184 if (location.y > max.y) { 185 location.y = min.y; 186 } 187 } 188 //力を加える 189 void addForce(PVector force) { 190 force.div(mass); //力と質量から加速度を算出 191 acceleration.add(force); //力を加速度に加える 192 } 193}

試したこと

translateを使って座標軸をずらしてみたが、同じ動きをする上に壁の位置までずれているのか、画面外に行ってしまう円もある。

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

processing3.5.3

TN8001👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

y_waiwai

2019/12/07 09:48

このままではコードが読みづらいので、質問を編集し、<code>ボタンを押し、出てくる’’’の枠の中にコードを貼り付けてください
msw

2019/12/07 09:50

すみません。修正しました。
TN8001

2019/12/07 10:18

メイン側のsetupとdrawも欲しいです。
thkana

2019/12/07 11:41

そのプログラムで、 > 増やした数だけ横に連なって同じ動きをしてしまう というのが観察できないのですが? (minimとか本質に関係ないならさっさと外して欲しい、なんて思ったりもするけれど)
guest

回答1

0

ベストアンサー

ellipse(location.x, location.y, playerIn, playerIn);
//translate(location.x/1.4,location.y/2);//位置はずれたが同じ動きでバウンド位置もずれる
//ellipse(location.x, location.y, playerIn, playerIn);

locationをいじってもvelocityaccelerationが同じなので、同じ動きになってしまいます。

ParticleVec2は円ひとつを表すオブジェクトですから、円の個数分作らなければなりません。

最初の5個とそれぞれの10個、合計55個のParticleVec2を作ります。
配列に入れるときに11個ずつ同じ位置になるようにすれば、後はほとんど変える必要はありません。

キープレスでリセットしたいので配列に入れる処理を関数に分け、setupkeyPressedで呼ぶようにします。

Processing

1//省略 2 3int NUM = 5 + 5 * 10; //パーティクルの数 55個 最初の5個+それぞれに10個 4ParticleVec2[] particles = new ParticleVec2[NUM]; 5 6void setup() { 7 fullScreen(); 8 smooth(); 9 frameRate(60); 10 colorMode(HSB, 360, 100, 100, 100); 11 12 minim = new Minim(this); 13 player = minim.loadFile("Mountain.mp3"); 14 player.loop(); 15 16 resetParticles(); 17} 18 19void resetParticles() { 20 // forいっこで書けるけど調整しやすいようにグループごとに設定した 21 int w=width/12; 22 int offset=width/12*3; 23 for (int i = 0; i < 11; i++) { // 左端 24 particles[i] = new ParticleVec2(); 25 particles[i].location.set(w+offset, height/2.3); 26 } 27 for (int i = 11; i < 22; i++) { 28 particles[i] = new ParticleVec2(); 29 particles[i].location.set(w*2+offset, height/2.3); 30 } 31 for (int i = 22; i < 33; i++) { // 真ん中 32 particles[i] = new ParticleVec2(); 33 particles[i].location.set(w*3+offset, height/2.3); 34 } 35 for (int i = 33; i < 44; i++) { 36 particles[i] = new ParticleVec2(); 37 particles[i].location.set(w*4+offset, height/2.3); 38 } 39 for (int i = 44; i < 55; i++) { // 右端 40 particles[i] = new ParticleVec2(); 41 particles[i].location.set(w*5+offset, height/2.3); 42 } 43} 44 45void keyPressed() { 46 resetParticles(); 47} 48//省略

投稿2019/12/07 12:35

編集2023/07/17 06:26
TN8001

総合スコア9317

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

msw

2019/12/07 16:59

TN様ありがとうございます。 なるほど、location以外も同じだからいくらlocationを弄っても駄目だったんですね。 繰り返し処理だけでやろうとしていたのが間違いでした。これからは配列を使ってみる事を意識します。 また、お手数をお掛けしたメインプログラムの追加に関しても、初めから全部載せる様にします。 ↓ご要望を送ってくださった他の方へのコメントです。 問題に関係ないminimを入れているのは、まさか実行をして原因を調べる方が居るとは考えていなかったからです。また、実行しても言っている問題と一致しないのは、試したことに書いてある通り別の方法を試した後のものを載せているからです。試す前と試した後のどちらを載せた方が良いか理解出来ておらず、大変申し訳ございませんでした。次からは、試す前のものなのか試した後のものなのかも記載致します。要望を送ってくださった皆様ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問