Javascriptで書いたシューティングゲーム

基本、杉本雅弘さんの本「ゲーム＆モダンJavaScriptで2倍楽しい］グラフィックスプログラミング入門 ——リアルタイムに動く画面を描く。プログラマー直伝の基本」をもとに実装したものですが一応、wasd対応したりリスタートにRキー対応、ゲーム中に流れる背景など個人の工夫も少し入れています。 この本からは内積と外積の使用によるホーミングミサイルの実装など内積外積を用いたプログラミングを学びました。
実際に実装したゲーム->シューティングゲーム

style_transfer

論文の再実装ではありますが、Kerasで作成したCNNを用いたオリジナル画像にスタイル画像の特徴を載せるというvgg16を用いたモデルです。 この程度のモデルなら実装できるというアピールのために作りました。 https://github.com/pop-ketle/style_transfer

chart.jsを用いたグラフ作成アプリ

.csvファイルの置いてあるサーバーにアクセスしてデータテーブルを作成、テーブルの各行をクリックするとグラフや情報が表示されるchart.jsの練習で作ったアプリです。
例の画像:

テクスチャ合成

手ごろな画像が残っていなかったので微妙な感じですが、

  1. 出力テクスチャを入力テクスチャのランダムなピクセルを割り当てることで初期化する。この時割り当てたピクセルを保存しておく。
  2. 出力テクスチャ上で全探索と同様にL字型の近傍群を探索する。
  3. L型近傍群の各ピクセルには出力テクスチャ上のどのピクセルの色が割り当てられたかという情報が保存されている。この情報を用いて出力テクスチャに割り当てる候補となるピクセルを限定する。よって最大候補数は近隣ピクセル群のピクセル数となる。
  4. 候補となる入力テクスチャ上の各候補ピクセル群と出力テクスチャ上のピクセル群を比較する。比較には、各ピクセルの差分の二乗和を用いる。もし、近隣ピクセル群が入力テクスチャをはみ出した場合、入力テクスチャ内に治るランダムな位置に候補ピクセルを変更する。
  5. 差分の二乗和がもっとも小さかった入力テクスチャのピクセルを出力テクスチャに割り当て、割り当てたピクセル座標も記録する。

といったアルゴリズムで入力画像から合成して作成した画像です。 –>