Website Demo Description

This page demonstrates embedding and interacting with web content inside CanvasX. You can use this feature to display live websites, dashboards, or external resources directly on your canvas for reference or collaboration.

Website Embedding Documentation

Overview

CanvasX supports embedding websites and web apps as interactive frames. This is useful for referencing external content, integrating dashboards, or collaborating with live web resources.

Key Properties

• src: string — The URL of the website to embed.
• width, height: number — The dimensions of the embedded frame.
• top, left: number — The position of the frame on the canvas.

Usage Example

const website = new XWebsite('https://example.com', {
  top: 100,
  left: 100,
  width: 800,
  height: 600,
});
canvas.add(website);

Tips & Best Practices

• Ensure the embedded website allows being loaded in an iframe (CORS and X-Frame-Options).
• Use website widgets for dashboards, documentation, or collaborative tools.
• Resize and position the frame for optimal viewing.