syncfusion-blazor-3D-charts

What this skill does

# Implementing Syncfusion Blazor 3D Charts

**NuGet:** `Syncfusion.Blazor.Chart3D` + `Syncfusion.Blazor.Themes`  
**Namespace:** `Syncfusion.Blazor.Chart3D`

A comprehensive skill for implementing and customizing Syncfusion's Blazor 3D Chart component. The 3D Chart provides stunning three-dimensional visualization for column, bar, and stacked chart types with rich customization options including rotation, tilt, depth, and various axis types.

## When to Use This Skill

Use this skill when you need to:
- Create three-dimensional charts in Blazor applications
- Visualize data with 3D column, bar, or stacked chart types
- Implement rotatable and tiltable 3D visualizations
- Configure category, numeric, datetime, or logarithmic axes for 3D charts
- Bind data from various sources (IEnumerable, remote data, dynamic objects)
- Customize 3D chart appearance (colors, depth, wall color, rotation)
- Add data labels, legends, and tooltips to 3D charts
- Configure axis labels, tick lines, and grid lines
- Enable selection, highlighting, and interaction in 3D charts
- Create multi-pane 3D chart layouts
- Export or print 3D charts
- Ensure WCAG accessibility compliance for 3D visualizations
- Troubleshoot 3D chart rendering or configuration issues

## Component Overview

**Package**: `Syncfusion.Blazor.Chart3D`  
**Component**: `SfChart3D`  
**Supported Chart Types**: Column, Bar, StackedColumn, StackedBar  
**Supported Axis Types**: Category, Numeric, DateTime, Logarithmic  
**Platforms**: Blazor Server, Blazor WebAssembly, Blazor Web App (.NET 8+)

The 3D Chart component renders data in three-dimensional space with configurable rotation, tilt, and depth for enhanced visual impact. It supports all standard chart features including multiple series, rich tooltips, legends, data labels, and extensive customization options.

## Documentation and Navigation Guide

### API Reference
📄 **Read:** [references/api-reference.md](references/api-reference.md)
- Complete API reference for Syncfusion.Blazor.Chart3D namespace
- SfChart3D component properties, methods, and events
- All chart series, axis, legend, and tooltip classes
- Data label, border, margin, and styling components
- Event argument classes for all chart events
- Enumerations (Chart3DSeriesType, ValueType, SelectionMode, etc.)
- Interface definitions and base classes
- Usage examples for common API scenarios
- Links to detailed online API documentation

### Events Reference
📄 **Read:** [references/events.md](references/events.md)
- Complete event reference for all 3D chart events
- Lifecycle events (OnCreated, OnResized)
- Rendering events (OnSeriesRender, OnPointRender, OnAxisLabelRender, etc.)
- User interaction events (OnPointClick, OnLegendClick, OnSelectionChanged)
- Mouse events (OnChartMouseMove, OnChartMouseClick, etc.)
- Export and data events (OnExported, OnAxisRangeRendered)
- Event argument properties and usage examples
- Complete working examples with multiple events
- Event handling best practices

### Getting Started
📄 **Read:** [references/getting-started.md](references/getting-started.md)
- Complete installation and setup for Blazor Server, WebAssembly, and Web App
- NuGet package installation (Syncfusion.Blazor.Chart3D)
- Service registration and namespace imports
- Script and theme configuration
- Creating your first 3D chart with complete code example
- Data source setup and basic binding
- Render mode configuration for .NET 8+
- Troubleshooting common setup issues

### Chart Types
📄 **Read:** [references/chart-types.md](references/chart-types.md)
- Column charts - vertical 3D bars
- Bar charts - horizontal 3D bars
- Stacked Column charts - vertically stacked series
- Stacked Bar charts - horizontally stacked series
- Chart type configuration (Chart3DSeriesType enum)
- Column/bar spacing and width customization
- Grouped columns with GroupName property
- Multiple series in single chart
- Complete code examples for each type

### Data Binding
📄 **Read:** [references/data-binding.md](references/data-binding.md)
- List binding with IEnumerable objects
- ExpandoObject binding for dynamic data structures
- DynamicObject binding for runtime data
- Remote data binding with SfDataManager
- DataSource, XName, YName property mapping
- Complex data structures and nested properties
- Dynamic data updates and refresh
- Performance optimization tips

### Axis Configuration
📄 **Read:** [references/axes-configuration.md](references/axes-configuration.md)
- Category Axis - for discrete categories
- Numeric Axis - for continuous numeric data
- DateTime Axis - for time-series data
- Logarithmic Axis - for exponential scale data
- ValueType property configuration
- Axis range (Minimum, Maximum, Interval)
- Axis titles and title rotation
- Tick lines and grid lines customization
- Multiple axes support
- Complete examples for each axis type

### Axis Labels
📄 **Read:** [references/axis-labels.md](references/axis-labels.md)
- Label formatting (LabelFormat property)
- Custom label templates
- Label rotation (LabelRotationAngle)
- Label placement (BetweenTicks, OnTicks)
- Label style customization (font, color, size)
- Smart label collision handling
- Custom label text with events
- Edge label placement
- Multilevel labels

### Data Labels
📄 **Read:** [references/data-labels.md](references/data-labels.md)
- Enabling data labels on series
- Label position configuration
- Label template customization
- Label styling (font, color, background)
- Smart label positioning
- Format customization
- Conditional label visibility
- Complete implementation examples

### Legend
📄 **Read:** [references/legend.md](references/legend.md)
- Enabling and positioning legends
- Legend alignment options
- Series name customization
- Legend styling and appearance
- Interactive legend toggle
- Custom legend items and icons
- Legend templates
- Complete configuration examples

### Tooltip
📄 **Read:** [references/tooltip.md](references/tooltip.md)
- Enabling tooltips on hover
- Tooltip format customization
- Custom tooltip templates
- Tooltip styling (border, fill, opacity)
- Multi-point tooltip content
- Shared tooltips across series
- Complete implementation examples

### Appearance and Styling
📄 **Read:** [references/appearance.md](references/appearance.md)
- Chart background and wall color
- Series colors and color palettes
- Theme integration (Material, Bootstrap, Fluent, Tailwind)
- Custom CSS styling with CssClass
- Opacity and transparency effects
- Border styles and customization
- Animation configuration
- Visual effects and enhancements

### Chart Dimensions and 3D Effects
📄 **Read:** [references/chart-dimensions.md](references/chart-dimensions.md)
- Chart size configuration (Width, Height)
- Responsive sizing techniques
- 3D rotation (EnableRotation, RotationAngle)
- Tilt angle configuration (TiltAngle)
- Depth configuration (Depth property)
- Wall size customization
- Perspective and viewing angle
- Complete dimension examples

### Selection and Highlighting
📄 **Read:** [references/selection.md](references/selection.md)
- Selection modes (Point, Series, Cluster)
- Enabling selection functionality
- Selection patterns and visual styles
- Multi-selection support
- Selection events and handling
- Programmatic selection
- Highlight modes and effects
- Complete selection examples

### Multiple Panes
📄 **Read:** [references/multiple-panes.md](references/multiple-panes.md)
- Creating multi-pane chart layouts
- Row and column pane configuration
- Assigning axes to specific panes
- Distributing series across panes
- Pane border and background customization
- Synchronized pane behavior
- Use cases for multiple panes
- Complete multi-pane examples

### Print and Export
📄 **Read:** [references/print-export.md](references/print-export.md)
- Print functionality
- Export to image formats (PNG, JPEG, SVG)
- Export to PDF documents
- Export configuration options
- Custom export settings
- Print preview customization
- Complete e