From 948879716d9818b98acdb31763afdcf7a47dafea Mon Sep 17 00:00:00 2001
From: yooian <yooian03@gmail.com>
Date: Sun, 3 Nov 2024 01:03:03 -0700
Subject: [PATCH] Create pie chart documentation tab

---
 .../types-of-charts/pie-chart/index.md        | 41 +++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 app/markdown/types-of-charts/pie-chart/index.md

diff --git a/app/markdown/types-of-charts/pie-chart/index.md b/app/markdown/types-of-charts/pie-chart/index.md
new file mode 100644
index 0000000..1e68f4f
--- /dev/null
+++ b/app/markdown/types-of-charts/pie-chart/index.md
@@ -0,0 +1,41 @@
+# Pie Chart
+## Introduction
+
+A pie chart is a circular graphic divided into slices, with each slice representing a proportion of the whole.
+
+
+Pie charts are especially useful for visualizing smaller datasets where understanding the relative proportions between categories is key. They excel at displaying categorical data in a way that emphasizes percentages or proportions, making it easy for viewers to quickly grasp scale and relative sizes.
+
+
+With PureChart, you gain extensive styling flexibility for creating fully customized pie charts that fit seamlessly into your application’s design. Each chart also includes a corresponding legend that clearly lists the categories represented.
+
+
+## Usage
+Adding a pie chart is simple:
+
+```erb
+<%= pie_chart @data %>
+```
+
+Here's an example of some data you could pass in:
+
+```rb
+@data = [
+    {
+        name: "Dogs",
+        color: "blue",
+        value: 150
+    },
+    {
+        name: "Cats",
+        color: "purple",
+        value: 135
+    },
+    {
+        name: "Parrots",
+        color: "orange",
+        value: 70
+    },
+]
+```
+And here is the corresponding chart: