AI

GPUを使わずにPCのローカルでStable Diffusionを動作させる

注意Stable Diffusion Direct MLをGPUを使わないで使用する方法をこの記事で紹介していますが、下の記事を参照してStable Diffusion Forgeを使用することをお勧めします。やりたいこと通常Stable DiffusionはNvidiaのGPU（GeForceなど）が必要です。ここではNVidiaのGPUが載っていないPCでCPUだけを用いてStable Diffusionを動作させる方法を紹介します。環境構築PythonのインストールPython 3.10.6を以下のページからダウンロードしてインストールします。インストールの際は以下の”Add Pytho...
2024.12.27
AI
Phaser3

画像を使用せずに凝ったボタンを作成する(graphics)(Phaser3)

やりたいことPhaser3ではGameObjectにクリックのイベントを登録してボタンとして使用することができます。しかしGameObjectは四角形や円などで画像を使用する以外に凝ったボタンを作成する子は難しいです。ここではgraphicsオブジェクトを使用して凝った(過度の丸い)ボタンを作成します。コード以下の関数を作成しました。function createRoundedRectangle(scene, x, y, width, height, radius, fill, stroke, strokeThickness) { const graphics = scene.add.grap...
2024.12.25
Phaser3
Phaser3

画像を使用せずに凝ったボタンを作成する(DOM)(Phaser3)

やりたいことPhaser3ではGameObjectにクリックのイベントを登録してボタンとして使用することができます。しかしGameObjectは四角形や円などで画像を使用する以外に凝ったボタンを作成する子は難しいです。ここではDomオブジェクトを使用して凝ったボタンを作成します。作成方法Domのオブジェクトは以下の記事で作成方法を紹介しました。記事を踏まえて以下の関数を作成しました。export function createBtn(scene, x, y, text, font_size, color, callback){ let el = document.createElement('...
2024.12.25
Phaser3
Phaser3

Domオブジェクトを使うまとめ(Phaser3)

やりたいことPhaser3上にHTMLのタグ(DOM)を配置するDomオブジェクトを使用すると、他のGameObjectとは使用方法が異なったため使用方法と注意点をまとめます。使用方法準備DOMオブジェクトを使用するには以下のコンフィグをセットする必要があります。 dom :{ createContainer: true },例えば以下のようにConfigを作成してセットします。const config = { type: Phaser.AUTO, width: 300, height: 200, parent: 'game-container', backgroundColor: '#000...
2024.12.25
Phaser3
アプリケーション

音声合成アプリAivisSpeechを使ってみる

やりたいこと無料のWindows向け（Mac向けもあるようです）音声合成アプリAivisSpeechを使ってみます。ダウンロードとインストール以下のページにアクセスして右上の以下のボタンをクリックします。Windowsの場合はWindows→インストーラー版を選択してダウンロードします。ダウンロードフォルダでインストーラを実行したらインストールが途中で止まりました。（間違えてキャンセルをクリックした可能性もありますが）別のフォルダにコピー後に再実行したらインストールできました。あとはエディットボックスに任意のセリフを入力して再生ボタンをクリックすることで読み上げされます。右上の保存ボタンから作...
2024.12.04
アプリケーション
Phaser3

imgエレメントの画像を表示(Phaser3)

やりたいことimgエレメントに設定された画像をPhaser3上に表示します。使用例以下の記事にあるようにScreenCaptureを行うと、画像はimgエレメントで返却されます。ScreenCaptureした画像を表示するにはこの記事で紹介する方法を行う必要があります。実装以下のようにimageエレメントからTextureを作成し、Textureに対してadd()でFrameを追加します。作成したTextureはimageとしてシーンに追加することができます。let image // this is image element // for example get by document.ge...
2024.12.03
Phaser3
Phaser3

画面の一部のScreenCapture(Phaser3)

やりたいことPhaser3で表示している画面のScreenCapture（snapshot）を取得します。背景Canvasエレメントを取得してImageを取得しようと思ったのですが、2DのContextを取得できなかったため、別の方法をさがしました。実装任意のシーンで以下の関数を呼びます。this.game.renderer.snapshotArea(x, y, width, height, callback);x,yは表示領域の左上からの座標です。（下図の赤領域がキャプチャする領域です。）callbackの引数はImageエレメントです。例として以下のような関数をcallbackとして設定し...
2024.12.02
Phaser3
ConoHa

【ConoHa】サブドメインを追加する

やりたいことConoHa Wingでサブドメインを追加します。（たまにしかやらないし、毎回迷うのでメモしておきます。）手順ConoHa Wingの管理画面にログインします。”サーバー管理”を選択し、”ドメイン”を選択します。右上に表示される”+ドメイン”ボタンをクリックします。”サブドメインを追加”タブを選択します。サブドメインを入力し、ドメインを契約しているドメインから選択します。無料独自SSLは必要に応じに利用するを選択します。設定が完了したら”保存”をクリックします。結果ConoHa Wingでサブドメインを追加することができました。追加したサブドメインはサイトの管理→左上の切り替えから...
2024.11.29
ConoHa
JavaScript

【対策コードあり】ローカルファイルをCanvasに表示する

やりたいことローカルの画像ファイルをHTMLのCanvasに表示します。検索するといくつか引っかかるのですが、試してみたところ動作しませんでした。（エラーなどは出力されずCanvasになにも表示されませんでした。）環境Chrome：131.0.6778.86試したコードHTML<input type="file" id="file" accept="image/png, image/jpeg"></div><canvas id="canvas"></canvas>JavaScriptdocument.getElementById("file").onchange = (event) => { ...
2024.11.27
JavaScript
ConoHa

ConoHaにアップロードしたバイナリが正しく読み込めない

やりたいことConoHaのサーバーにファイルマネージャーを用いてアップロードしたバイナリが正しく読み込めないという現象が起きました。実際に起きたのはAI向けのモデルをファイルマネージャーでアップロードしてJavaScriptで読み込もうとしたところ失敗しました。（404などのエラーではなく構成が正しくないというエラーが起きました。そのためファイルが壊れているように見えます。）対策原因実際にアップロード後に失敗したファイルは拡張子なしでした。ConoHaのファイルマネージャーは拡張子なしのファイルをアップロードするとテキストファイル（アスキー）として扱います。解決策アップロード時にバイナリファイ...
2024.11.27
ConoHa
次のページ