A versatile and highly interactive pie/donut chart component with smooth animations and hover effects. Perfect for visualizing data proportions, statistics, or any circular data representation in your Framer projects. Seamlessly switches between pie and donut styles with just one click.

✨ Key Features

• Dual Chart Types: Toggle between pie and donut chart styles instantly
• Dynamic Data Segments: Add unlimited data segments with custom colors
• Smooth Animations: Beautiful entrance animations with configurable delays between segments
• Interactive Hover Effects: Engaging hover animations with custom scaling and color transitions
• Gap Control: Add spacing between segments for a modern, separated look
• Responsive Design: Automatically adapts to any container size
• Customizable Stroke: Fine-tune border width and color for perfect styling

💡 Pro Tips

1. Use the gap angle property to create modern, separated segments
2. Customize the entrance animation delay between segments for a sequential reveal effect
3. Set different hover colors to create engaging interactive states
4. Adjust the donut size for various visual styles - from thin rings to thick circles
5. Use the stroke properties to create contrast between segments
6. Configure the "in view" animation to trigger once or repeatedly as users scroll

🎨 Styling Options

• Segments: Custom colors, hover colors, and proportional values
• Animation: Entrance timing, hover effects, and between-segment delays
• Donut Style: Center hole size and background color
• Gaps: Spacing between segments
• Stroke: Border width and color for segment outlines

This component brings beautiful data visualization to your Framer projects with zero coding required, while maintaining full flexibility to customize every aspect of its appearance and behavior through the property controls.