CDN

Use @vizbl/room-viewer when you want Room Viewer to attach itself to existing DOM elements.

Minimal setup

<script
  type="module"
  src="https://cdn.jsdelivr.net/npm/@vizbl/room-viewer/dist/room-viewer.module.min.js"
></script>

<button
  data-vizbl-room-viewer-dialog
  data-vizbl-room-viewer-type="poster"
  data-vizbl-room-viewer-src="https://example.com/poster.jpg"
  data-vizbl-room-viewer-name="Abstract Poster"
  data-vizbl-room-viewer-width="1"
  data-vizbl-room-viewer-height="1.5"
  data-vizbl-room-viewer-language="en"
>
  Preview in room
</button>

Product types

Poster

• Use data-vizbl-room-viewer-src.
• Pass both data-vizbl-room-viewer-width and data-vizbl-room-viewer-height.

Carpet

• Use data-vizbl-room-viewer-tinuuid.

Behavior notes

• The CDN build binds to click events for every element that matches data-vizbl-room-viewer-dialog.
• Elements inserted later are picked up automatically.
• Posters load the exact src image you pass.
• Carpets start from tinuuid, then Room Viewer resolves the material internally.

Next steps

• Open Reference for the full attribute matrix.
• Open Troubleshooting if the dialog does not open or the asset fails to load.