🔗 統合表示クラス設計

class UnifiedDisplay { constructor(width, height) { this.canvas = new OffscreenCanvas(width, height); this.ctx = this.canvas.getContext('2d'); this.htmlRenderer = null; this.videoRenderer = null; } render() { // HTML部分を描画 if (this.htmlRenderer) { this.htmlRenderer.draw(this.ctx, 0, 0); } // 動画部分を描画 if (this.videoRenderer) { this.videoRenderer.draw(this.ctx, 0, 200); } } }
✅ 1つのCanvasに統合
HTMLと動画を同じ領域に配置可能
✅ 位置指定で配置
柔軟なレイアウトが実現