{"id":181,"date":"2025-03-13T07:56:51","date_gmt":"2025-03-13T07:56:51","guid":{"rendered":"https:\/\/documentation.iqonic.design\/graphina\/?p=181"},"modified":"2025-03-21T05:38:50","modified_gmt":"2025-03-21T05:38:50","slug":"how-to-add-a-donut-chart","status":"publish","type":"post","link":"https:\/\/documentation.iqonic.design\/graphina\/how-to-add-a-donut-chart\/","title":{"rendered":"Donut Chart"},"content":{"rendered":"<div class=\"nolwrap\">\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n\n\n\n<p>A <strong>Donut Chart<\/strong> is a variation of a pie chart that provides a clearer visualization of proportions while allowing space in the center for additional information. It\u2019s perfect for showcasing percentages, survey results, or category distributions. With Graphina, you can easily create and customize a <strong>Donut Chart<\/strong> to match your website\u2019s design.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Step-by-Step Guide to Adding a Donut Chart<\/strong><\/h2>\n\n\n\n<p>\u2705 <strong>Step 1:<\/strong> Open the <strong>Graphina library<\/strong> and drag &amp; drop the <strong>Donut Chart<\/strong> into your Elementor editing space.<\/p>\n\n\n\n<p>\u2705 <strong>Step 2:<\/strong> Go to <strong>Chart Settings<\/strong> and enter the <strong>data values and labels<\/strong> for each segment.<\/p>\n\n\n\n<p>\u2705 <strong>Step 3:<\/strong> Adjust the <strong>Chart Size, Donut Thickness, and Inner Radius<\/strong> to achieve the desired visual effect.<\/p>\n\n\n\n<p>\u2705 <strong>Step 4:<\/strong> Enable the <strong>Toolbar<\/strong> for interactive features like tooltips, legends, and slice animations.<\/p>\n\n\n\n<p>\u2705 <strong>Step 5:<\/strong> Customize your chart by modifying the <strong>Slice colors, Border width, Label settings, Background transparency, and 3D effects<\/strong> to enhance its aesthetics.<\/p>\n\n\n\n<p>With these simple steps, you can create a visually appealing <strong>Donut Chart<\/strong> that effectively presents your data. Watch the tutorial for a complete walkthrough! \ud83d\ude80<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Graphina | How To Customize Donut Chart - Tutorial 6 | Iqonic Design\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/BPPFzW404_Y?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>A Donut Chart is a variation of a pie chart that provides a clearer visualization of proportions while allowing space in the center for additional information. It\u2019s perfect for showcasing percentages, survey results, or category distributions. With Graphina, you can easily create and customize a Donut Chart to match your website\u2019s design. Step-by-Step Guide to [&hellip;]<\/p>\n","protected":false},"author":12,"featured_media":0,"parent":125,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-181","post","type-post","status-publish","format-standard","hentry","category-graphina"],"featured_image_src":null,"author_info":{"display_name":"wordpressadminiq","author_link":"https:\/\/documentation.iqonic.design\/graphina\/author\/wordpressadminiq\/"},"children":[],"_links":{"self":[{"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/posts\/181","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/comments?post=181"}],"version-history":[{"count":3,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/posts\/181\/revisions"}],"predecessor-version":[{"id":545,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/posts\/181\/revisions\/545"}],"up":[{"embeddable":true,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/posts\/125"}],"wp:attachment":[{"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/media?parent=181"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/categories?post=181"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/documentation.iqonic.design\/graphina\/wp-json\/wp\/v2\/tags?post=181"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}