From 4b05975a633f57ff53edc20806d8b01122544b16 Mon Sep 17 00:00:00 2001
From: Stamates <Stamates@users.noreply.github.com>
Date: Tue, 5 Oct 2021 12:05:45 -0400
Subject: [PATCH 1/3] Add DoughnutChart example

---
 lib/demo_web/live/page_live.ex        | 51 ++++++++++++++++++++++++++-
 lib/demo_web/live/page_live.html.leex |  6 ++++
 2 files changed, 56 insertions(+), 1 deletion(-)

diff --git a/lib/demo_web/live/page_live.ex b/lib/demo_web/live/page_live.ex
index 10c540d..710429a 100644
--- a/lib/demo_web/live/page_live.ex
+++ b/lib/demo_web/live/page_live.ex
@@ -9,6 +9,7 @@ defmodule DemoWeb.PageLive do
   alias Uncharted.Axes.{BaseAxes, MagnitudeAxis, XYAxes}
   alias Uncharted.BarChart
   alias Uncharted.ColumnChart
+  alias Uncharted.DoughnutChart
   alias Uncharted.LineChart
   alias Uncharted.PieChart
   alias Uncharted.ProgressChart
@@ -137,13 +138,61 @@ defmodule DemoWeb.PageLive do
 
     progress_chart = progress_chart(from: column_chart)
 
+    doughnut_chart = %BaseChart{
+      title: "Best kind of doughnut",
+      colors: %{
+        rose_gradient: %Gradient{
+          start_color: "#642B73",
+          stop_color: "#C6426E"
+        },
+        blue_gradient: %Gradient{
+          start_color: "#36D1DC",
+          stop_color: "#5B86E5"
+        },
+        red_gradient: %Gradient{
+          start_color: "#FF9486",
+          stop_color: "#FF1379"
+        }
+      },
+      dataset: %DoughnutChart.Dataset{
+        data: [
+          %BaseDatum{
+            name: "Cake",
+            fill_color: :red_gradient,
+            values: [30.0]
+          },
+          %BaseDatum{
+            name: "Creamstick",
+            fill_color: :blue_gradient,
+            values: [28.0]
+          },
+          %BaseDatum{
+            name: "Glazed",
+            fill_color: :rose_gradient,
+            values: [25.0]
+          },
+          %BaseDatum{
+            name: "Powdered",
+            fill_color: :blue_gradient,
+            values: [17.0]
+          }
+        ],
+        center_value: 100,
+        center_value_fill_color: :blue_gradient,
+        label: "Donuts Tasted",
+        label_fill_color: :rose_gradient,
+        secondary_label: "(all by me)"
+      }
+    }
+
     {:ok,
      assign(socket,
        bar_chart: bar_chart(),
        column_chart: column_chart,
        pie_chart: pie_chart,
        progress_chart: progress_chart,
-       line_chart: line_chart
+       line_chart: line_chart,
+       doughnut_chart: doughnut_chart
      )}
   end
 
diff --git a/lib/demo_web/live/page_live.html.leex b/lib/demo_web/live/page_live.html.leex
index 24d52e7..6222b33 100644
--- a/lib/demo_web/live/page_live.html.leex
+++ b/lib/demo_web/live/page_live.html.leex
@@ -45,4 +45,10 @@
       <%= UnchartedPhoenix.render(@socket, @bar_chart)  %>
     </div>
   </div>
+  <div class="card__grid-1">
+    <div class="card">
+      <h3 class="u-center u-push-bottom"><%= Uncharted.Chart.title(@doughnut_chart) %><br /><span class="caption">the doughnut chart</span></h3>
+      <%= UnchartedPhoenix.render(@socket, @doughnut_chart) %>
+    </div>
+  </div>
 </section>

From 0989f8bfb8842f40c58431d9a673e8b6d74b65a8 Mon Sep 17 00:00:00 2001
From: Stamates <Stamates@users.noreply.github.com>
Date: Sat, 9 Oct 2021 15:01:02 -0400
Subject: [PATCH 2/3] Add labels for data table

---
 lib/demo_web/live/page_live.ex | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/lib/demo_web/live/page_live.ex b/lib/demo_web/live/page_live.ex
index 710429a..6224ff1 100644
--- a/lib/demo_web/live/page_live.ex
+++ b/lib/demo_web/live/page_live.ex
@@ -177,6 +177,8 @@ defmodule DemoWeb.PageLive do
             values: [17.0]
           }
         ],
+        data_name_label: "Donut Type",
+        data_value_label: "Percentage",
         center_value: 100,
         center_value_fill_color: :blue_gradient,
         label: "Donuts Tasted",

From cdab1ea9f1d1226a622474a382173baccc116819 Mon Sep 17 00:00:00 2001
From: Stamates <Stamates@users.noreply.github.com>
Date: Sat, 9 Oct 2021 15:01:35 -0400
Subject: [PATCH 3/3] Change from doughnut to donut

---
 lib/demo_web/live/page_live.ex        | 10 +++++-----
 lib/demo_web/live/page_live.html.leex |  4 ++--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/lib/demo_web/live/page_live.ex b/lib/demo_web/live/page_live.ex
index 6224ff1..6ddce97 100644
--- a/lib/demo_web/live/page_live.ex
+++ b/lib/demo_web/live/page_live.ex
@@ -9,7 +9,7 @@ defmodule DemoWeb.PageLive do
   alias Uncharted.Axes.{BaseAxes, MagnitudeAxis, XYAxes}
   alias Uncharted.BarChart
   alias Uncharted.ColumnChart
-  alias Uncharted.DoughnutChart
+  alias Uncharted.DonutChart
   alias Uncharted.LineChart
   alias Uncharted.PieChart
   alias Uncharted.ProgressChart
@@ -138,8 +138,8 @@ defmodule DemoWeb.PageLive do
 
     progress_chart = progress_chart(from: column_chart)
 
-    doughnut_chart = %BaseChart{
-      title: "Best kind of doughnut",
+    donut_chart = %BaseChart{
+      title: "Best kind of donut",
       colors: %{
         rose_gradient: %Gradient{
           start_color: "#642B73",
@@ -154,7 +154,7 @@ defmodule DemoWeb.PageLive do
           stop_color: "#FF1379"
         }
       },
-      dataset: %DoughnutChart.Dataset{
+      dataset: %DonutChart.Dataset{
         data: [
           %BaseDatum{
             name: "Cake",
@@ -194,7 +194,7 @@ defmodule DemoWeb.PageLive do
        pie_chart: pie_chart,
        progress_chart: progress_chart,
        line_chart: line_chart,
-       doughnut_chart: doughnut_chart
+       donut_chart: donut_chart
      )}
   end
 
diff --git a/lib/demo_web/live/page_live.html.leex b/lib/demo_web/live/page_live.html.leex
index 6222b33..ae896b2 100644
--- a/lib/demo_web/live/page_live.html.leex
+++ b/lib/demo_web/live/page_live.html.leex
@@ -47,8 +47,8 @@
   </div>
   <div class="card__grid-1">
     <div class="card">
-      <h3 class="u-center u-push-bottom"><%= Uncharted.Chart.title(@doughnut_chart) %><br /><span class="caption">the doughnut chart</span></h3>
-      <%= UnchartedPhoenix.render(@socket, @doughnut_chart) %>
+      <h3 class="u-center u-push-bottom"><%= Uncharted.Chart.title(@donut_chart) %><br /><span class="caption">the donut chart</span></h3>
+      <%= UnchartedPhoenix.render(@socket, @donut_chart) %>
     </div>
   </div>
 </section>