# simple_meta_viewer (Meta HUD) 「わんコメ(OneComme)」から送信される統計データ（同接・高評価）を、スタイリッシュなデザインで表示するための OBS 用 HUD テンプレートです。 ## 構成ファイル - `index.html`: メインの HUD および設定パネル。 - `viewer01.png`: 同接（VIEWER）用カスタムアイコン。 - `like01.png`: 高評価（LIKE）用カスタムアイコン。 ## 主な機能 - **スタイリッシュなデザイン**: グラスモーフィズムを採用したモダンな外観。 - **2項目の表示**: 同接数（VIEWER）と高評価数（LIKE）を並べて表示。 - **コントロールパネル内蔵**: - 色、透明度、角丸、ぼかし、間隔などをブラウザ上でリアルタイムに調整可能。 - アイコンの切り替え（絵文字 / 内蔵SVG / カスタム画像）。 - 設定の `localStorage` 保存に対応。 ## 使い方 1. 本フォルダをわんコメの `templates/custom` ディレクトリ内に配置します。 2. わんコメのテンプレート一覧からOBSへD&Dで追加します。 3. 画面上に表示されるコントロールパネルを使ってデザインを調整します。 4. 調整が終わったら、OBS の「フィルタ」→「クロップ/パッド」を使用して、画面下部のコントロールパネル部分を隠して運用します。 ## 技術仕様 ### データ受信 (OneSDK) 本テンプレートは、わんコメの標準的な「カスタムテンプレート」として動作し、`onesdk.js` を介して直接統計情報を購読します。 - **接続方法**: `OneSDK.connect()` - **受信アクション**: `meta` - **利用項目**: `viewer`, `viewers`, `upVote`, `likes`, `likeCount`, `goodCount` ### その他の仕様 - **設定の保存**: コントロールパネルで変更した内容は `localStorage` に保存され、次回の読み込み時に自動で反映されます。 ### ライセンス - 改造・再配布自由。 - 配信スタイルに合わせて自由にカスタマイズしてください。 ※わんコメの利用規約には準拠してください。