Back to Home
Dec 21, 2024•15 min read•Integration

Embedding QuickSight in Your Applications

Learn how to embed QuickSight dashboards and visuals into your web applications.

Why Embed QuickSight?

Embedding QuickSight allows you to bring powerful BI capabilities directly into your applications. Your users get seamless analytics without leaving your app, and you maintain control over the user experience.

🔧 Embedding Options

Dashboard Embedding

Embed entire dashboards with full interactivity, filters, and navigation.

Visual Embedding

Embed individual visuals for focused, targeted analytics experiences.

Console Embedding

Give users the full QuickSight authoring experience within your app.

Q Search Bar

Embed the QuickSight Q search bar for natural language queries.

Authentication Methods

IAM Identity Center

Best for enterprise SSO integration with existing identity providers.

Anonymous Embedding

For public-facing dashboards without user authentication requirements.

Code Example

Here's how to embed a QuickSight dashboard using the JavaScript SDK:

import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk';

const embeddingContext = await createEmbeddingContext();

const dashboard = await embeddingContext.embedDashboard({
  url: embedUrl,
  container: '#dashboard-container',
  height: '700px',
  width: '100%',
});

💡 Pro Tip

Use the SDK's callback functions to handle events like parameter changes, page navigation, and error states. This allows you to create a truly integrated experience.