Threejs(Java script)

glTF(.gltf)ファイルをLoadして表示(Threejs)

やりたいことThreejsやMicrosoftが推奨されているglTF(.gltf)ファイル、.binファイル、テクスチャファイルで分割された３DファイルをThreejsを簡単に読み込みたい。Blenderでの保存方法は以下のページ環境Threejs：　r150Chrome：　111.0.5563.65読み込みと表示読み込みと表示は.glbと同じコードで読み込めます。loadObjects(scene,"./dice.glb");上記で指定している読み込みファイルを指定の.gltfに変更します。.gltfファイルを保存する際に同時に作成される.binファイルとテクスチャファイルはソースコードの...
2023.05.15
Threejs(Java script)
3D

glTFファイルを直接編集する。(Blender)

やりたいことi以下のページで作成したgltTF Separateの.glTFファイルを直接編集します。テキスト(JSON)として編集gltTF Separateの.glTFファイルはJSONフォーマットのためテキストファイルとして編集ができます。Blenderで日本語を使用すると（オブジェクト名、マテリアル名など）、.glTFファイル内ではデコードされます。編集はできますが、対象の設定を探すのを楽にしたい場合は英語を使用しておいたほうが便利です。テクスチャの変更テクスチャは以下のように宣言されます。"images" : [ { "mimeType" : "image/png", "name" ...
2023.05.13
3D
Blender

glTFファイル保存時にテクスチャを外部ファイルとして保存する(Blender)

やりたいことBlenderでglTF 2.0でエクスポートする際に単一ファイルでなく、テクスチャを外部ファイルとして保存する。環境Blender：3.4.1フォーマットの変更左上の”ファイル”　→　”エクスポート”　→　glTF 2.0(.glb/.gltf)　からエクスポートダイアログを表示します。表示されるダイアログの右側のフォーマットをクリックします。glTF Separate(.gltf + .bin + テクスチャ)を選択して保存します。結果選択したフォルダに、指定したファイル名.gltf、指定したファイル名.bin、テクスチャファイル（画像ファイル）が保存されます。例）3D.glt...
2023.05.13
Blender
ブラウザ

Edgeの拡張機能を自作する

やりたいことEdgeの拡張機能を自作EdgeとChromeの拡張機能Edgeの拡張機能とChromeの拡張機能は基本的に同じです。すべてが使用できるかはわかりませんが、Chrome向けに作成した拡張機能はEdgeでも使用できます。簡単なChromeの拡張機能の作成方法は下のページを参照してください。拡張機能の登録作成した拡張機能を登録する方法は下のページを参照してください。
2023.05.11
ブラウザ
ブラウザ

自作のChrome拡張機能をEdgeで使用する

やりたいこと自作のChromeの拡張機能をEdgeで使用する。Chromeの拡張機能の作成は以下のページ環境Edge：112.0.1722.64拡張機能の登録すべての拡張機能で保証するものではありませんが、Chromeの拡張機能をEdgeに登録するために修正は不要です。以下の手順で作成した拡張機能をEdgeに登録します。Edgeを開き、上記のようにユーザ名横の”…”　→　”拡張機能”を選択します。上のGUIが表示されるので、”拡張機能の管理”をクリックします。画面左の”開発者モード”をオンにします。”開発者モード”のチェックが表示されない場合は画面左の三をクリックして表示させます。画面右側に”...
2023.05.03
ブラウザ
ブラウザ

Chromeの拡張機能(manifest v3)を使用して特定のページを変更する

やりたいことChromeの拡張機能を使用して特定のページを変更する。サーバーのファイルを編集するわけではなく拡張機能をインストールしたPCでのみ有効です。環境Chrome：112.0.5615.138拡張機能のmanifestに関して拡張機能のmanifest：V3現在、検索で出てくる多くのページで説明されているChromeの拡張機能はmanifest Version2 (V2)です。V2は将来的に廃止予定ですので可能な限りV3を使用したほうが賢明です。また2023/1や2023/6にV2が廃止になるような記載があるページがありますが、誤りか情報が古いです。現在（2023/5月現在）、廃止の予...
2023.05.02
ブラウザ
Blender

三角柱、四角柱（正N角柱）を作成する（Blender）

やりたいこと基本的な形でありながら知らないと作るのに苦戦する三角柱、四角柱を作成する。環境Blender：3.4.1円柱から作成円柱の作成”追加”　→　”メッシュ”　→　”円柱”　を選択して円錐を作成します。円柱の設定変更円柱を作成すると左下に以下のGUIが表示されます。円柱を作成後に、画面をクリックするなど他の操作をすると上のGUIは消えて円柱が確定します。操作の前に以下の作業をする必要があります。上記のGUIをクリックし表示されるGUIの”頂点”を変更します。上記のGUIをクリックし表示されるGUIの”頂点”を変更します。三角柱を作成する場合は、”頂点”を３にします。四角柱を作成する場合は...
2023.05.02
Blender
Blender

レンダリング結果を確認しながらカメラの位置/回転を調整する（Blender）

やりたいこと３Dの画像を見ながカメラの位置/回転を調整する。レンダリング領域（≒拡大）は下のページを参照。環境Blender：3.4.1カメラ視点とオブジェクトプロパティによる調整カメラ視点に変更テンキーの0を押すことでカメラ視点に変更することができます。0キーを押すと上の表示がこちらのような表示なります。オレンジの枠内がレンダリングの領域です。 カメラの移動/回転の調整 カメラオブジェクトを選択します。 オブジェクトプロパティを選択し位置/回転をドラッグ（もしくは値入力）で変更します。結果上記の操作によりレンダリング領域を確認しながらカメラの回転/移動を行えます。メニューの”レンダー”から”...
2023.05.02
Blender
Blender

左右対称オブジェクトを作成(Blender)

やりたいことBlenderで左右対称のオブジェクトを作成。ここでは２つの方法を紹介します。環境Blender：3.4.1モディファイアーによる左右対称モディファイアー左右対称にしたいオブジェクトを作成します。モードをオブジェクトモードにして、作成したオブジェクトを選択します。今回は下のようなオブジェクトを用意しました。モディファイアープロパティタブから”モディファイアーを追加”を選択します。表示される一覧から”ミラー”を選択します。結果モディファイアーを追加した時点で以下のようにオブジェクトが左右対称になります。X軸以外の対称X軸以外で対称にする場合は、以下の”座標軸”の対象にする軸を選択しま...
2023.05.02
Blender
Android

Androidで開発者向けオプションの表示方法まとめ

やりたいことAndroidで開発者向けオプションを表示します。機種ごとに複数のページを作成したのでまとめます。開発者向けオプションを表示
2023.05.02
Android
次のページ