API-based embedding

Toucan AI supports API-based embedding for advanced integrations where you want to fetch analytics data (dashboards, charts, or results) directly from the backend and render it in your own UI. This method is ideal for custom workflows, data mashups, or when you need to fully control the presentation layer.

How It Works

• Direct API Calls: Use REST or GraphQL APIs to fetch dashboard or chart data from Toucan AI.

• Token Authentication: All API requests require a valid, server-generated embed token for secure access.

• Custom Rendering: You are responsible for rendering the data in your application using your own components, charts, or UI framework.

Example (REST API)

fetch('https://toucanai.cloud/api/v1/dashboards/your-dashboard-id', {
  method: 'GET',
  headers: {
    'Authorization': 'Bearer YOUR_EMBED_TOKEN'
  }
})
  .then(res => res.json())
  .then(data => {
    // Render dashboard data using your own UI
    console.log(data);
  });

Key Features

• Maximum Flexibility: Use any UI library or charting framework to present analytics.

• Custom Workflows: Combine Toucan AI data with other sources, or build highly tailored user experiences.

• No UI Lock-in: You control the look, feel, and interactivity of the embedded analytics.

When to Use

• You want to build a fully custom analytics UI.

• You need to combine Toucan AI data with other APIs or business logic.

• You require advanced interactivity or data manipulation not supported by the web component or SDK.

Limitations

• You must handle all rendering, state, and error management.

• Requires more development effort than web component or SDK-based embedding.

• API endpoints and schemas may evolve; check the Embedding API reference for details.