processing.jsのドロップダウンメニュー

Question

私は6年生で、processing.jsを使用してサイエンス課題に取り組んでいます。

（火山噴火に関する）情報を入力すると、（そのようがあったどのように多くの犠牲者として）この噴火に関するいくつかの情報の出力を備えている

今私は、入力ページに取り組んでいます - 具体的には、溶岩の種類を選択するドロップダウンメニューです。

ドロップダウンボックスをクリックすると、他のボックスが表示されますが、クリックしても何も起こりません。私はここで本当にシンプルなものを見落としてしまったと思うが、うまくいかないだろう。私がこのドロップダウンボックスで得ることができる他の援助は評価されるでしょう。ここで

は、メニューを描画するコードの抜粋です：

//text boxes---------- 
rect(95, 30, 66, 22); 
rect(95, 65, 66, 22); 

fill(255, 255, 255); 
textSize(16); 

text("ash spread", 5, 47); 

text("lava type", 5, 83); 

    var draw = function() { 

      if (mouseIsPressed && mouseX > 95 && mouseX < 161 && mouseY > 65 && mouseY < 87) { 
      ltDropDown = true; 
      } 

     if (ltDropDown === true) { 
      fill(0, 0, 0); 

      rect(95, 87, 66, 22); 
      rect(95, 109, 66, 22); 
      rect(95, 131, 66, 22); 
      rect(95, 153, 66, 22); 

      fill(255, 255, 255); 
      textSize(15); 

      text("Basaltic", 100, 92, 66, 22); 
      text("Andesitic", 100, 114, 66, 22); 
      text("Dacitic", 100, 136, 66, 22); 
      text("Rhyolitic", 100, 158, 66, 22); 
     } 

      if (mouseIsPressed && ltDropDown === true) { 
      ltDropDown = false; 
      } 
     //-------------------------------------- 

Answer 1

将来的には、あなたは本当にMCVEを提供しようとする必要があります。コードをコピーして自分のマシンに貼り付けて、あなたと同じことを見ることができるはずです。また、JSFiddleの投稿を検討することもできます。コードを実行できない場合は手伝いが難しいので、私たちがあなたを助けてくれるようにしましょう！

あなたが投稿したコードから、私は問題があると思う：いつドロップダウンメニューをクリアするのですか？

ltDropDownをfalseに設定した後でも、他のものを描画することはありません。既に描画したドロップダウンメニューはそこにとどまります。

処理では、フレームごとに自動的にキャンバスが消去されるとは思うかもしれませんが、そうではありません。それをしたい場合は、draw()関数を呼び出すたびにbackground()関数を呼び出す必要があります。

さらに詳しい情報はthe referenceにあります。

PS：これは宿題なので、ドロップダウンにProcessingを使用する必要がありますが、そうでない場合は、純粋なJavaScriptを使用してHTMLドロップダウンボックスを作成することを検討してください。宿題のポイントが最初にあなた自身でそれをすることでなければ、それはあなた自身で行うよりはるかに簡単です。