HTML

「マンデルブロ集合を鑑賞するツールを作成した」開発日記

マンデルブロ集合を鑑賞するツールを作成した youtu.be 先日動画を公開しました。 マンデルブロ集合を鑑賞するツールを作成しました。 Unity や three.jsなどは使わずに、ゲームエンジン部分も自作です。 よかったら上記の動画も確認してみてください。 また…

TypeScriptとWebGLでポリゴンを描画する方法

目次 はじめに webpack + TypeScriptのプロジェクトを作成する シェーダのソースコードをimportする 実際にポリゴンを描画する さいごに 1. はじめに この記事では、WebGLでポリゴンを描画する方法を紹介します。 言語はTypeScriptを使います。 わざわざJava…

Nuxt.js + Typescript + Vuetify の空プロジェクトを作成しました

目次 概要 プロジェクトの作り方 さいごに 1. 概要 Webで新しいプロジェクトを作るときって意外と大変だったりしますよね。 あの設定ファイルってどうするんだっけ。 あのライブラリはどこで有効にできるんだっけ。 そんなことに悩むのが面倒だったので、基…

Nuxt.js と Typescript で Store の変更と読み出し

目次 概要 準備 Storeの変更 Storeの読み出し まとめ 1. 概要 最近Web開発はNuxt.js + Typescriptの組み合わせが気に入っています。 せっかく気に入っているので、この組み合わせでの開発ノウハウを記載しておきます。 今回は基礎の基礎、Storeの変更と読み…

three.jsでカメラとの距離を無視して描画順序を制御する方法

目次 この記事の目的 描画順序を制御する方法 描画処理のソースコード 全ソースコード まとめ 1. この記事の目的 この記事では、カメラからの距離を無視して描画順序を制御する方法を紹介します。 今回は例として、二つのオブジェクトを空間に配置し、描画…

【WebAssembly】JSとwasmでソートの速度を比較する

目次 この記事の目的 C++でソートを実装 JSでソートを実装 実行用のHTMLを準備する 実際に速度を比較する まとめ

【WebAssembly】JS側で作成したtyped arrayをwasm側に渡す

目次 この記事の目的 wasm側のソースコードを準備 wasmにコンパイルするスクリプトを準備 JSのtyped arrayをwasmに渡す方法 サンプルの動作確認を行うHTMLを準備 まとめ

【WebAssembly】babael, webpackと一緒にwasmを使う

目次 この記事の目的 babel, webpackの導入 JavaScriptのソースコードを用意する サンプルを動かすHTMLを準備する wasmに変換するソースコードを準備する Utilsクラスでwasm読み込みを実装する 動作確認用のHTMLを準備する まとめ

【WebAssembly】wasm側で動的に作成したインスタンスをJSに渡す

目次 この記事の目的 JSに渡したいクラスをC++で定義する wasmのソースコードを実装する JS側でポインタからインスタンスを読み込む HTMLからwasmを読み込んで実行する まとめ

【WebAssembly】C/C++で実装された既存の資産をincludeする

目次 この記事の目的 includeされる側のクラスを実装 ビルド用のスクリプトを準備 includeする側の実装 HTMLからwasmを読み込み実行する まとめ

【WebAssembly】C/C++からJavaScriptで実装した関数を実行する

目次 この記事の目的 C/C++でコールバック関数の定義のみ書く JavaScriptでコールバック関数の実装を書く emccで –pre-js オプションでビルドする HTMLから読み込んで実行する まとめ

【WebAssembly】Getting Started をDocker で試す

目次 WebAssemblyとは サンプルを動かしてみる サンプルの動作を解説する まとめ 1. WebAssemblyとは WebAssembly(wasm)とは、JavaScript高速化の最新技術です。JavaScriptの高速化技術であるasm.jsがさらに進化したものです。C/C++, Rust, Goなどの言語で記…

Unity Web Player をブラウザの画面に合わせて起動する

Unity Web Player をブラウザの画面に合わせて起動する 結論 Project をビルドした時に生成される HTML ファイルを編集する。コミットログを見ればわかる方は次のリンクへ飛んでください。以降では HTML の編集箇所の説明を書きます。 ※ Unity Web Player は…