- SVGファイルのベクターパスを立体押し出しできる「SVG」モードを追加(テキストモードと切替) - 表面色・側面色を個別指定できるマテリアル(ExtrudeGeometryの表裏キャップ面/側面グループを利用)と、面取り厚み・サイズ・分割数の詳細スライダーを追加 - 面取りが形状に対して大きすぎてジオメトリが破綻した場合に自動的に無効化し警告を出す防御処理を追加 - ⚙設定モーダルを3カラム構成(左: ライト/マテリアル/カメラのタブ切替、中央: プレビュー、右: 常時表示のテキストパネル)に再設計し、テキスト入力・フォント・整列をツールバーからモーダルへ移動、行間スライダーを新規追加 - モーダルを開いている間、コマ位置追従用ResizeObserverがプレビューを画面外へ書き戻してしまう不具合を修正 - モーダル名を「3D Text Editor」に、設定ボタンを「⚙ 3D設定」に変更し、テキスト初期値を設定してコマ配置直後から内容を確認できるようにした - ヘルプ(ja/en/zh)・README 3言語・DEVLOGを更新 Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
44 lines
2.3 KiB
JavaScript
44 lines
2.3 KiB
JavaScript
// text3d.js — comfyui-vrm-pose-editor への薄いブリッジ(pose3d.js と同一パターン)
|
||
//
|
||
// 3Dテキスト機能はThree.js本体を自前で持たず、ComfyUIカスタムノード
|
||
// 「comfyui-vrm-pose-editor」が WEB_DIRECTORY 経由で配信する three.module.js / OrbitControls.js /
|
||
// three-vrm.module.js を動的importして再利用する。three-vrm.module.js は3DポーズのVRM表示だけでなく
|
||
// MToonMaterial(VRMのトゥーンシェーダー)も標準クラスとしてexportしており、GLTFロード無しでも
|
||
// 単体でnewできるため、3Dテキストのトゥーン調マテリアルにもそのまま流用する。
|
||
// text3d-core.js はTHREE非依存に書かれているため、ここで取得したTHREE/OrbitControls/MToonMaterial/
|
||
// SVGLoaderを注入するだけの役割を持つ。SVGLoaderはSVG立体化機能(テキストと同様にvendor化した
|
||
// three r160版 examples/jsm/loaders/SVGLoader.js)のパース処理に使う。
|
||
//
|
||
// ノード未インストール時は window.initText3DEditor を一切公開しない。呼び出し側
|
||
// (25-text3d-bridge.js / Text3DTool.js)は既存の pose3d 呼び出し元と同じリトライ機構
|
||
// (typeof window.initText3DEditor !== 'function' なら300ms後に再試行)で扱う。
|
||
|
||
const NODE_BASE = '/extensions/comfyui-vrm-pose-editor/';
|
||
const THREE_URL = NODE_BASE + 'vendor/three.module.js';
|
||
const ORBIT_URL = NODE_BASE + 'vendor/OrbitControls.js';
|
||
const VRM_URL = NODE_BASE + 'vendor/three-vrm.module.js';
|
||
const SVG_URL = NODE_BASE + 'vendor/SVGLoader.js';
|
||
const CORE_URL = '/ccc_static/js/text3d-core.js';
|
||
|
||
async function _installBridge() {
|
||
const [THREE, orbitMod, vrmMod, svgMod, core] = await Promise.all([
|
||
import(THREE_URL),
|
||
import(ORBIT_URL),
|
||
import(VRM_URL),
|
||
import(SVG_URL),
|
||
import(CORE_URL),
|
||
]);
|
||
|
||
window.initText3DEditor = function (canvas, options) {
|
||
return core.initText3DEditor(THREE, orbitMod.OrbitControls, vrmMod.MToonMaterial, svgMod.SVGLoader, canvas, options);
|
||
};
|
||
}
|
||
|
||
_installBridge().catch((err) => {
|
||
console.error(
|
||
'[text3d] comfyui-vrm-pose-editor が見つかりません。' +
|
||
'ComfyUIのcustom_nodesにインストールされているか確認してください。',
|
||
err
|
||
);
|
||
});
|