Interactive Pie and Donut chart

interactive Pie and Donut chart. #interactivechat #figmacommunity #figmacomponents #smartcharts
Figma file link:https://www.figma.com/community/file/1491413441833328838/visualization-pie-and-donut-chart

Easier way to design interactive pie and donut chart with hover and click interactions.

Step 1. Create boolean variables for different events like in given example work, eat commute, Watch TV and Sleep.

Step 2. Take 5 ellipse/circle as there are total 5 events

Step 3. Using Arc create slice / pie

Step 4 Use Start pointer to move the slice

Step 5 Use Sweep to enter the percentage value

Step 6 for Donut chart Give ratio in percentage

Step 7 finally add prototype while hovering and mouse leave interactions

Видео Interactive Pie and Donut chart канала curdweb