日記帳の裏側で。

こんにちは。

１１月も最後となりました。
この１か月何してたんだろうという感じです。


もともとできていたわけでもないのに、
久しぶりに取り組むなーと思うと、
納得がいかなかったりします。

こういうとき
「年々、できることが減ってるな」
と思ってしまいます。


わからないことが続くと
手を止めてしまい、
それ以後手を付けなくなり
いつの間にか時間がたっている
よくあります。


もうちょっと
気持ちにゆとりがあって、
のんびりできればいいですが、
そうもいかないとなると
生きている意味すらよくわからなくなります。

こんにちは

今週のアスファルト9のプレイ状況ですが、
まず、PC版はちょこちょこ動画を出してみることにしました。

ポンコツプレイ記録 - YouTube
https://www.youtube.com/playlist?list=PL8qPxKZorvxdzvz1hEy7yZM4S0lxDNL9-

Switch 版

PC 版でスペシャルイベントとして 488 GTB EVO の GRAND PRIX が行われていましたが、
Switch 版では TECHRULES AT96 というランク A のクルマです。

スターアップはようやく BEAST が MAX になりました。
クラスＣとしては加速力がよくて使いやすいクルマだなーという印象。
あとはインポートパーツをそろえたい。

スターアップ

• FORD GT MAX
• ACURA NSX ★
• REZVANI BEAST X MAX

PC 版

スペシャルイベントのタイムが上がらず、順位が後退している。
488 GTB EVO のカードもそろいそうにないので、
あとはタイムをつけておいて、得点を稼いでいくだけか。

VULCAN が★4になったり、クラス S の CENTENARIO がアンロックできたり、割と進んでいる。
というか、PC はいつも開いているので Switch 版よりやってる気がする。

ZEROUNO のイベントがあったのですが、
あと５枚でアンロックというところで終わってしまいました。
あとちょっとだったのに・・・。

アンロック

• FERRARI LAFERRARI
• LAMBORGHINI CENTENARIO

スターアップ

• ASTON MARTIN VULCAN MAX

こんにちは。

週末になるとひたすら「週末」をタイトルにつけたがります。

最近は寒くなってきて、
ふとんから出づらくなってきました。

そろそろ次のことも考えたいのですが、
なんか気が乗らない、
けど不安になる憂鬱な感じです。

んー気が沈むー。

こんにちは。

もぐら。で遊んでいて、いつも画像のちらつきが気になっていました。
ロゴとか、もぐらがちかちか、とたまにちらつくな、と。
したら単純なミスでした。

そもそもどう描画しているのか

もぐら。は JavaScript の Canvas で描画していて、
１つの画像内にいくつかもぐらのしぐさによって、
絵をかき分けて書いています。
（プログラム上で画像を分割して使用する）

単純にバッファの問題かと思った

他のゲーム制作とかだと、
事前に見えないウインドウなどを作って、描画する絵を作っておいて、
必要な時に作った絵をコピーして、見えるウインドウに貼り付ける
ダブルバッファリングというみたいな処理が必要なのかと思っていたのですが、
結果何も変わらない・・・。チカチカー。

画像を描画する処理で

こんな書き方していました。

function drawimg() {
let img = new Image();
img.src="画像のパス";
drawImage(img, ...);
}
この関数は描画するたびに呼ばれます。
例えば、もぐらの穴を描画したいとき、
穴は26個あるので、26回呼ばれます。

このコードで問題なのは new Image() を毎回しているところで、
ここで画像を管理する仕組みを呼び出して、画像管理.src （ソース）にて、
画像のパスを指定します。ここで画像がパスから読み込まれます。

これをだいたい 30 fps (１秒間に30回画面の書き換え) を行うため、
画像を毎回パスから読み込んで表示していたようです。。。

これは、ブラウザーでよく F12 キーを押すと出てくる開発者ツールの、
ネットワークの通信内容を確認する機能があり、
そこで確認するとその画像が毎回ではないにしろ、
点滅する時点で読み込まれているのがわかりました。

結局は、
let img;
// drawImg が呼ばれたら実行
function drawImg() {
drawImage(img, ...);
}

// ページ読み込み時に発火
window.addEventListener('load', function {
// 先に画像を読み込んで
img = new Image();
img.src = "画像パス";
// 描画処理をする (ここでは3枚)
drawImg();
drawImg();
drawImg();
}
);
と、先に、画像を読み込んでおいてから、
画像を描画することで開発者ツールも１度の読み込みのみになりました。


初歩的なミスでしたが、本日プログラムをアップデートしました。
ネットで探しても改善するわけないよなーという事例でした。
（自分用・・・）

---

2020.11.27 addEventListener のコードの記述ミスを修正

こんにちは。

今日は何曜日でしょうか？
月曜日が勤労感謝の日、ということで、
曜日感覚がちょっと鈍りますね。


今週はなんか寒くなって、
何にもやる気が起きない。

３連休あたりからひたすら画像を作っています。
主にもぐら。の画像をもう少し凝りたいからです。
引っ込んだりする時のアニメーション画像をもう少しなんとかできないかな？とも思っています。

拡大しても劣化しない、ベクター形式の画像の作成が
最近自分の中でのトレンドです。


プログラムも画像もなんとか上達したいですが、自分の中の世界が狭いのか、
どうしても自力でがんばろうとしてしまいます。

でも、自力だと時間はかかるし、うまくいかないとあきらめてしまうので、
インターネットで探してみたり、本がないか探してみたりしています。

BGM・・・SE・・・音楽・・・？