How embedding works
Embedding allows you to take any dashboard created in Basedash and add it to your own app wrapper. To embed a dashboard:- Click the Share button in the top right corner of your dashboard
- Enable “Embedding”
- Basedash provides you with the iframe code to copy
- Paste the embed code into your application
Getting embed codes
Embeds use public dashboard links with the/shared/{id}
path. Copy the code from the share menu:
Use cases
Customer-facing dashboards
Embed charts into customer portals to show:- Account performance metrics
- Usage statistics
- Billing information
- Custom analytics
Internal tools
Integrate charts into internal applications:- CRM systems
- Project management tools
- Executive dashboards
- Team collaboration platforms
Marketing websites
Display public-facing metrics:- Company performance indicators
- Product usage statistics
- Customer success metrics
- Industry benchmarks
Documentation sites
Embed charts into documentation to show:- API usage examples
- Performance benchmarks
- Feature adoption rates
- System health metrics
Embedding with filters
Variable injection
You can pass variables via query parameters. On public dashboards, variables use theevar_
prefix and values use Base64 encoding:
- Use
evar_{syntax}={value}
for public dashboards - Built-in variables:
dateRange
,groupByInterval
,customDateFrom
,customDateTo
Filter visibility control
Control what users can see and modify:- Allow user interaction: Let users change filters and explore data
- Disable user visibility: Hide filters to show only specific data slices
- Preset values: Lock filters to specific values for consistent views
Dynamic filtering
Update embedded charts programmatically:- Change filters via JavaScript
- Respond to user interactions
- Sync with parent application state
- Real-time data updates
Security and access control
Secure data isolation
When a dashboard is embedded in an application, public variable values are URL-encoded with theevar_
prefix to avoid leaking labels and to simplify link sharing. For advanced isolation needs, contact us.
Authentication
Embedded charts respect your Basedash access controls:- User authentication required
- Role-based permissions
- Data access restrictions
- Session management
Customer data isolation
Perfect for showing users dashboards of their own data without allowing them to see anything else:- User-specific dashboards
- Customer portals
- Account-specific analytics
- Personalized views
Public embeds
Create public embeds for non-sensitive data:- Marketing materials
- Public dashboards
- Demo content
- Educational resources
Private embeds
Secure embeds for sensitive data:- Customer-specific data
- Internal metrics
- Financial information
- Proprietary analytics
Technical implementation
Basic embed code
Responsive embedding
Best practices
Responsive design
- Use responsive iframe containers
- Test on different screen sizes
- Ensure mobile compatibility
- Maintain aspect ratios
Performance optimization
- Lazy load embedded charts
- Cache embed codes
- Minimize iframe updates
- Use appropriate chart sizes
User experience
- Provide loading states
- Handle error scenarios
- Maintain consistent styling
- Ensure accessibility
Security considerations
- Validate embed URLs
- Sanitize filter parameters
- Monitor embed usage
- Implement rate limiting
Custom embedding
For more information about custom embedding, including advanced security features and styling options, please contact us.Chart types for embedding
Interactive charts
- Line charts: Time series with date filters
- Bar charts: Category comparisons with entity filters
- Funnel charts: Journey analysis with time filters
- Activity charts: Daily patterns with date ranges
Data displays
- Tables: Detailed data with sorting and filtering
- Number displays: Key metrics with time filters
- Detail: Entity information with selection filters
- Text components: Formatted content with context filters
Specialized visualizations
- Map visualizations: Geographic data with region filters
- Image displays: Visual content with entity filters
Related features
- Filters and variables - Control embedded chart data
- Dashboards - Organize charts for embedding
- Chart types - Choose the right charts for embedding
- Custom context - Improve AI understanding for embedded charts