戻る| タイマーで一定間隔でスピードを早くする方法 |
| タイマーの実行間隔を短縮 |
[HTML/CSS]
copy
let index = 0;
//ひよこの歩く判定のため追加
let flgStop = 1;//[0]動作可能 [1]停止状態
const aryX=[150,150,150,150,100, 50, 0, 0, 0, 0, 50,100];
const aryY=[0 , 50,100,150,150,150,150,100, 50, 0, 0, 0];
intiMap();
//マップの通り道を設定
function intiMap()
{
//通り道
for(i=0; i < aryX.length; i++)
{
const obj = document.getElementById("map"+i);
obj.style.left = aryX[i] +'px';
obj.style.top = aryY[i] +'px';
}
//ひよこを初期位置にします
moveChick()
}
//ひよこの場所変更
function moveChick()
{
//ひよこ
const obj = document.getElementById("hiyoko");
obj.style.left = aryX[index] +'px';
obj.style.top = aryY[index] +'px';
}
//次のインデックスを決定します
function nextIndex()
{
index++;
if(index >= aryX.length)
{
index =0;
}
}
let intervalId;//setIntervalが返すID
let timeElapsed = 0;//経過時間
let intervalTime = 1000; //初期間隔 (1秒)
const maxTime = 60000; //最大時間 (60秒)
const reductionIntervalTime = 10000; //短縮間隔を短縮する間隔 (10秒)
let timerCount = 0;//タイマーカウント(このカウントの判定結果で次の時間間隔を再計算します)
function funcTimer()
{
// 実行したい処理を記述
console.log("実行中: ", timeElapsed / 1000, "秒経過", "間隔: ", intervalTime);
timeElapsed += intervalTime;
if (timeElapsed >= maxTime)
{
clearInterval(intervalId);
console.log("タイマー停止");
}
else if (timerCount >= 10)
{
intervalTime -= 100;//実行間隔(ミリ秒:1000ミリ秒は1秒)を短縮します
if(intervalTime<100)
{
intervalTime = 100;//最低でも0.1秒とします
}
clearInterval(intervalId);//停止します
intervalId = setInterval(funcTimer, intervalTime);
timerCount = 0;
}
moveChick();//ひよこを動かします
nextIndex();//次のインデックスを決定します
timerCount++;
}
intervalId = setInterval(funcTimer, intervalTime);
else if (timerCount >= 10)
カウントが10回になったら
タイマーの実行間隔を短縮するため、タイマーをリセットします。
そのため実行間隔の変数をマイナスにします。
intervalTime -= 100;
タイマーの実行間隔を短縮する計算します。
if(intervalTime<100){
intervalTime = 100;//最低でも0.1秒とします
}
そのままだとマイナスになるため、最低値を0.1秒に設定しています。
clearInterval(intervalId);//停止します
上記ステップでタイマーをリセットしています。
実行間隔を短縮します。
timeElapsed += intervalTime;
経過時間を再計算します。
if (timeElapsed >= maxTime)
{
clearInterval(intervalId);
console.log("タイマー停止");
}
経過時間が60秒になったらタイマーを停止します。
[謝辞]
「イラスト：農民イラスト」さんの画像を使用させていただいております。
ありがとうございます。
戻る back| How to speed up at regular intervals using a timer |
| Reduced the timer execution interval |
[HTML/CSS]
copy
let index = 0;
//Added for chick walking detection
let flgStop = 1;//[0] Operable [1] Stopped
const aryX=[150,150,150,150,100, 50, 0, 0, 0, 0, 50,100];
const aryY=[0 , 50,100,150,150,150,150,100, 50, 0, 0, 0];
intiMap();
//Set the map path
function intiMap()
{
//path
for(i=0; i < aryX.length; i++)
{
const obj = document.getElementById("map"+i);
obj.style.left = aryX[i] +'px';
obj.style.top = aryY[i] +'px';
}
//Set the chick to its initial position
moveChick()
}
//Chick location change
function moveChick()
{
//Chick
const obj = document.getElementById("hiyoko");
obj.style.left = aryX[index] +'px';
obj.style.top = aryY[index] +'px';
}
//Determine the next index
function nextIndex()
{
index++;
if(index >= aryX.length)
{
index =0;
}
}
let intervalId;//ID returned by setInterval
let timeElapsed = 0;//Elapsed time
let intervalTime = 1000; //Initial interval (1 second)
const maxTime = 60000; //Maximum time (60 seconds)
const reductionIntervalTime = 10000; //Interval to shorten execution interval (10 seconds)
let timerCount = 0;//Timer count (the result of this count is used to recalculate the next time interval)
function funcTimer()
{
//Describe the process you want to perform
console.log("Running: ", timeElapsed / 1000, "Seconds Elapsed", "Interval: ", intervalTime);
timeElapsed += intervalTime;
if (timeElapsed >= maxTime)
{
clearInterval(intervalId);
console.log("Timer stop");
}
else if (timerCount >= 10)
{
intervalTime -= 100;//Reduce the execution interval (milliseconds: 1000 milliseconds is 1 second)
if(intervalTime<100)
{
intervalTime = 100;//At least 0.1 seconds
}
clearInterval(intervalId);//Stop
intervalId = setInterval(funcTimer, intervalTime);
timerCount = 0;
}
moveChick();//Move the chick
nextIndex();//Determine the next index
timerCount++;
}
intervalId = setInterval(funcTimer, intervalTime);
else if (timerCount >= 10)
When the count reaches 10,
Reset the timer to shorten the timer execution interval.
To do this, set the execution interval variable to a negative value.
intervalTime -= 100;
Calculate how to shorten the timer execution interval.
if(intervalTime<100){
intervalTime = 100;//At least 0.1 seconds
}
If left as is, it will become negative, so the minimum value is set to 0.1 seconds.
clearInterval(intervalId); // Stop
The above step resets the timer.
Shorten the execution interval.
timeElapsed += intervalTime;
Recalculate the elapsed time.
if (timeElapsed >= maxTime)
{
clearInterval(intervalId);
console.log("Timer stopped");
}
Stop the timer when 60 seconds have elapsed.
[Acknowledgements]
images used are from "illustration by nawmin.com"
Thank you very much.
back 