JavaScript【有料】SVGをJavaScriptでインラインにする
やりたいこと SVGファイルをJavaScriptで操作するにはSVGファイルをHTMLに埋め込む（インラインにする）必要があります。 しかしSVGファイルを更新した際に毎回、HTMLを更新するのは手間であり、ミスを誘発します...
JavaScript
JavaScriptJavaScript【有料】ViteでGeminiの画像生成
やりたいこと Googleの生成AIであるGeminiをNodeJSで使用して、画像生成を行います。 実装はフロントエンドのみでバックエンドはGoogleにあるGeminiを使用します。 GoogleのAPIキーを発行す...
JavaScriptイベントトリガで一回だけ実行する(JavaScript)
やりたいこと JavaScriptでイベントをトリガにして処理を行う場合、addEventListenerを使用しますが、１度だけしか実行したくないときがあります。（準備が終わったイベントで初期化とか） removeEven...
JavaScriptJavaScriptでOBSを操作
やりたいこと JavaScriptでOBS操作します。 注意点 この記事で紹介する方法は大きく二つの問題があります。作業する前にご確認ください。 注意点1：普通のブラウザから使えるわけでない OBSの外部のブ...
JavaScriptjavascriptでemをpxに変換する。
やりたいこと CSSなどで使用するemをpxの単位に変換します。 コード 以下の関数にemのサイズを渡すとpxのサイズが返ってきます。 第2引数は変換するオブジェクトを表示するエレメントを渡します。 func...
JavaScriptwebページからAivisSpeechを使用した読み上げを行う
やりたいこと 以下のページではJavaScriptの基本機能であるSpeechSynthesisを使用して読み上げを行いましたが、発音がいまいちでした。 そこでより発音のきれいなAivisSpeechを使用して読み...
JavaScript【対策コードあり】ローカルファイルをCanvasに表示する
やりたいこと ローカルの画像ファイルをHTMLのCanvasに表示します。 検索するといくつか引っかかるのですが、試してみたところ動作しませんでした。 （エラーなどは出力されずCanvasになにも表示されませんでした。）...
JavaScriptXにポストするボタンをウェブサイトに載せる
やりたいこと ウェブサイトにX（旧ツイッター）にハッシュタグ付きのポスト（ツイート）するためのボタンを配置します。 コードの取得 以下のサイトにアクセスします。 ”A Hashtag, like #wh...
JavaScriptTeachable Machineを使って画像の判別Webアプリを作る
やりたいこと googleのAI Modelを作成するサービスであるTeachable Machineを使ってWebアプリを作成します。 この記事ではPCのカメラ撮影した画像でトレーニングを行い、PCのカメラの入力に応じて動作...
JavaScriptjavascriptでハッシュ(“SHA-256”)の値を取得
やりたいこと javaScriptでハッシュ("SHA-256")の値を取得します。 実装 以下の関数でハッシュを取得できます。 async function digestMessage(message) { ...