2016-08-11 16 views
1

何かをコード化してから何年も経ちましたが、今ではp5.jsを取得する必要があります。練習として、私は単純な描画プログラムを作ろうとしていました。私はプログラムをデフォルトで黒で描画し、画面の隅にある赤い四角形をクリックすると色を赤に変えました。私は次の非常にお粗末なコードを持っていました(私はマウスのプレスが正確に赤い四角形に並んでいないことを知っています、 '描画'の仕組みは最高ではありません、などです)私はちょうどそれを気にしていますatm)連続関数のグローバル変数を参照する(p5.js)

function setup() { 
 
\t createCanvas(600, 600); 
 
\t fill ('red'); 
 
    \t rect(570,20,5,5); 
 
    //creates red rectangle at top right corner of screen 
 

 
} 
 
var color = 0; 
 
function mousePressed(){ 
 
\t if (mouseX > 570) { 
 
    \t \t if(mouseY > 20){ 
 
    \t \t \t color = 4; 
 
    \t \t \t ellipse (10,20,50,50); 
 
    \t \t } 
 
    \t \t 
 
    \t } 
 
} 
 
function draw() { 
 
\t 
 
    stroke(color); 
 
    if (mouseIsPressed) { 
 
    \t ellipse(mouseX, mouseY, 1, 1) 
 
    \t //creates colored dot when mouse is pressed 
 
    } 
 
} 
 

 
function keyTyped(){ 
 
\t if (key === 'c'){ 
 
\t \t clear(); 
 
\t } 
 
}

私は変数とだけではなく、0にストロークを設定する「色」を使用しない場合、私は十分に黒で描くことができます。そして、mousePressed関数が動作しているようです - 私が長方形を押すと、私はテストするために入れた楕円を描画します。しかし、私はdraw関数でvar 'color'を参照することができないようです - おそらく愚かな問題ですが、私は困惑していると認めます!私は間違って何をしていますか?

答えて

1

変数の命名には注意が必要です。具体的には、既存の関数と同じ名前を付けるべきではありません。 the Processing.js help articlesから

:JavaScriptを強力な機能の

一つは、そのダイナミックな、型なし性質です。 Javaなどの型指定された言語、したがってProcessingでは、あいまいさの恐れなしに名前を再利用できる(たとえば、メソッドのオーバーロード)場合、Processing.jsはできません。 JavaScriptの内部動作に着くことなく、処理開発者のための最善のアドバイスは、function/class/etcを使用しないことです。変数名としてProcessingからの名前例えば、lineという名前の変数は妥当と思われるかもしれませんが、同様の名前のline()関数にはProcessingとProcessing.jsが組み込まれています。

Processing.jsはJavaScriptであるため、関数を変数に格納することができます。たとえば、color変数はcolor()関数です。したがって、独自のcolor変数を作成すると、その変数を上書きするため、color()関数を呼び出すことができなくなります。

color変数の名前をmyColorに変更するのが最も簡単な解決方法です。

関連する問題