CANVASアニメーション(1)setInterval()/clearInterval()完成したグラフを一挙に表示する方法はxycoordinate.htmlで示しました。ここでは、xの増加に伴いyがどのように変化するかを、描画に遅延させる方法を示します。その方法のうち、Javascriptの標準関数であるsetInterval()/clearInterval()を用いる方法を示します。setInterval()/clearInterval()に似た機能をもつ関数に、setTimeout()/clearTimeout()がありますが、私にはその違いが理解できないので省略します。setInterval()/clearInterval()は記述面での制約があり、利用しにくい面があります。他言語ではsleep()やwait()など遅延機能の関数がありますが、Javascriptにはありません。疑似的にそれと似た機能を持たせる工夫を「アニメーション(2)」で示します。実例とソースリスト実例まず[実行]をクリックしてください。(5~100に変えて再実行してください)ソースリストSCRIPT部のJavascriptは次の通りです。外部ライブラリ「xycoordinate.js」に関しては「XY座標系の設定」を参照してください。value="20"></input>」で、interval=20を指定しています。20/1000秒間隔でループの部分が繰り返し処理されるので、グラフが伸びていくように見えるのです。intervalの値をにより速度を変えることができます。遅延して表示するのではなく一挙に表示するのであれば、「ループ」の部分は次のようになります(forを用いるほうが簡潔でしょうが、説明の都合で、whileを用います)。このループに入る前にxの初期値設定が必要ですが割愛しています。y;}sleep()やwait()のような遅延関数があれば、簡単に実現できます。y;}ところが、、残念なことにJavascriptには、そのような遅延関数がありません(これはJavascriptの性質に基づくのだそうですが、私は理解していません)。「一定時間(ms)ごとに処理内容を繰り返して実行せよ」という意味です。}内に繰り返し処理を記述します。一定時間);setInterval()は、whileと異なり、ループを抜け出す条件を記述できません。setInterval()を止める関数clearInterval()を用います。一般形は、clearInterval(止めるsetIntervalの名称)>ですので、setInterval()に名前を付ける必要があります。一定時間);のようになります。timerIdは任意の名称でかまいません。複数個所に記述できる「実例」のグラフの場合、「x>xmax」だけでなく、グラフがCANVASの上端に達したとき「y>ymax」も打切条件にするなど、「ループ」の中ならば、clearIntervalは複数個所に記述できます(ループの外では記述できません)。interval);clearIntervalの機能は、returnやbreakと似ていますが、微妙に異なります。・・・D正解は「A→B→C」です。最初のAは当然ですが、clearIntervalが発生しても、続くB~Cは実行されるのです。Cから先頭に戻って2度目のAが実行されることはないし、ループから脱出してDが実行されることもないのです。eval(f)が定義されないような場合にはエラーになります。Dには到達しないのです。Dを実行する必要があるならば、次のように記述する必要があります。xmax-dx)」とすべきでしょうが)。setInterval(...);」を複数回通ってはならない私はこの理由を正確に知らないのですが、繰り返し処理がいつ実行されるのかが不明確だと考えると当然な気もします。次のような記述はできないのです。x*(x-1)を同一CANVASに描画する場合を考えます。2つのグラフを同時に描画するのであれば、xに対するyの値をyh=f(x)=eval(f)とyg=g(x)=eval(g)の二つにして、次のように記述すれば、setIntervalは1回ですみます。interval);処理全体でsetIntervalは唯一でなければならない(のだろうか?)ところが、グラフ1を描画した後で、グラフ2を付け加えるようにしようとすると、私はその方法を知りません。失敗1も失敗2もグラフ2しか表示されないのです。ご教示いただければ幸甚です。{setup();drow1();drow2();}。