diff --git a/resources/views/livewire-column-chart.blade.php b/resources/views/livewire-column-chart.blade.php
index 12724b6..7fd56ce 100644
--- a/resources/views/livewire-column-chart.blade.php
+++ b/resources/views/livewire-column-chart.blade.php
@@ -58,6 +58,8 @@
                             },
                         },
 
+                        legend: component.get('columnChartModel.legend') || {},
+
                         plotOptions: {
                             bar: {
                                 horizontal: false,
diff --git a/resources/views/livewire-pie-chart.blade.php b/resources/views/livewire-pie-chart.blade.php
index cde4dbf..76a4b7f 100644
--- a/resources/views/livewire-pie-chart.blade.php
+++ b/resources/views/livewire-pie-chart.blade.php
@@ -2,7 +2,6 @@
     class="w-full h-full"
     x-data="{ ...pieChart() }"
     x-init="drawChart(@this)"
-    x-on:draw-column-chart.window="drawChart(@this)"
 >
     <div wire:ignore x-ref="container"></div>
 
@@ -12,10 +11,6 @@
                 chart: null,
 
                 drawChart(component) {
-                    this.renderApex(component)
-                },
-
-                renderApex(component) {
                     if (this.chart) {
                         this.chart.destroy()
                     }
@@ -73,6 +68,8 @@
                                 }
                             }
                         ],
+
+                        legend: component.get('pieChartModel.legend') || {},
                     };
 
                     this.chart = new ApexCharts(this.$refs.container, options);
diff --git a/src/Models/BaseChartModel.php b/src/Models/BaseChartModel.php
index 62aaec8..14956ee 100644
--- a/src/Models/BaseChartModel.php
+++ b/src/Models/BaseChartModel.php
@@ -9,12 +9,15 @@ namespace Asantibanez\LivewireCharts\Models;
  */
 class BaseChartModel
 {
-    use HasAxisConfiguration;
-    use HasStrokeConfiguration;
+    use HasAxis;
+    use HasStroke;
+    use HasLegend;
 
     public function __construct()
     {
-        $this->setupAxis();
+        $this->initAxis();
+        $this->initStroke();
+        $this->initLegend();
     }
 
     public function reactiveKey()
@@ -24,16 +27,17 @@ class BaseChartModel
 
     public function toArray()
     {
-        return [
-            'xAxis' => $this->xAxis,
-            'yAxis' => $this->yAxis,
-            'stroke' => $this->stroke,
-        ];
+        return array_merge(
+            $this->axisToArray(),
+            $this->strokeToArray(),
+            $this->legendToArray()
+        );
     }
 
     public function fromArray($array)
     {
-        $this->setupAxis($array);
-        $this->setupStroke($array);
+        $this->axisFromArray($array);
+        $this->strokeFromArray($array);
+        $this->legendFromArray($array);
     }
 }
diff --git a/src/Models/ColumnChartModel.php b/src/Models/ColumnChartModel.php
index b3d1ca0..27d7272 100644
--- a/src/Models/ColumnChartModel.php
+++ b/src/Models/ColumnChartModel.php
@@ -3,13 +3,11 @@
 
 namespace Asantibanez\LivewireCharts\Models;
 
-use Ramsey\Uuid\Uuid;
-
 /**
  * Class ColumnChartModel
  * @package Asantibanez\LivewireCharts\Models
  */
-class ColumnChartModel
+class ColumnChartModel extends BaseChartModel
 {
     public $title;
 
@@ -23,6 +21,8 @@ class ColumnChartModel
 
     public function __construct()
     {
+        parent::__construct();
+
         $this->title = '';
 
         $this->animated = false;
@@ -76,17 +76,19 @@ class ColumnChartModel
 
     public function toArray()
     {
-        return [
+        return array_merge(parent::toArray(), [
             'title' => $this->title,
             'animated' => $this->animated,
             'onColumnClickEventName' => $this->onColumnClickEventName,
             'opacity' => $this->opacity,
             'data' => $this->data->toArray(),
-        ];
+        ]);
     }
 
     public function fromArray($array)
     {
+        parent::fromArray($array);
+
         $this->title = data_get($array, 'title', '');
 
         $this->animated = data_get($array, 'animated', false);
@@ -97,10 +99,4 @@ class ColumnChartModel
 
         $this->data = collect(data_get($array, 'data', []));
     }
-
-    public function reactiveKey()
-    {
-        return md5(json_encode($this->toArray()));
-    }
-
 }
diff --git a/src/Models/HasAxisConfiguration.php b/src/Models/HasAxis.php
similarity index 78%
rename from src/Models/HasAxisConfiguration.php
rename to src/Models/HasAxis.php
index 00fb40b..01ae7aa 100644
--- a/src/Models/HasAxisConfiguration.php
+++ b/src/Models/HasAxis.php
@@ -4,39 +4,18 @@
 namespace Asantibanez\LivewireCharts\Models;
 
 
-trait HasAxisConfiguration
+trait HasAxis
 {
     private $xAxis;
 
     private $yAxis;
 
-    public function __construct()
+    public function initAxis()
     {
         $this->xAxis = $this->defaultXAxis();
         $this->yAxis = $this->defaultYAxis();
     }
 
-    public function setXAxisVisible($visible)
-    {
-        data_set($this->xAxis, 'labels.show', $visible);
-
-        return $this;
-    }
-
-    public function setYAxisVisible($visible)
-    {
-        data_set($this->yAxis, 'show', $visible);
-
-        return $this;
-    }
-
-    protected function setupAxis($array = [])
-    {
-        $this->xAxis = data_get($array, 'xAxis', $this->defaultXAxis());
-
-        $this->yAxis = data_get($array, 'yAxis', $this->defaultYAxis());
-    }
-
     private function defaultXAxis()
     {
         return [
@@ -52,4 +31,33 @@ trait HasAxisConfiguration
             'show' => true,
         ];
     }
+
+    public function setXAxisVisible($visible)
+    {
+        data_set($this->xAxis, 'labels.show', $visible);
+
+        return $this;
+    }
+
+    public function setYAxisVisible($visible)
+    {
+        data_set($this->yAxis, 'show', $visible);
+
+        return $this;
+    }
+
+    protected function axisFromArray($array)
+    {
+        $this->xAxis = data_get($array, 'xAxis', $this->defaultXAxis());
+
+        $this->yAxis = data_get($array, 'yAxis', $this->defaultYAxis());
+    }
+
+    protected function axisToArray()
+    {
+        return [
+            'xAxis' => $this->xAxis,
+            'yAxis' => $this->yAxis,
+        ];
+    }
 }
diff --git a/src/Models/HasLegend.php b/src/Models/HasLegend.php
new file mode 100644
index 0000000..447b12f
--- /dev/null
+++ b/src/Models/HasLegend.php
@@ -0,0 +1,43 @@
+<?php
+
+
+namespace Asantibanez\LivewireCharts\Models;
+
+
+trait HasLegend
+{
+    private $legend;
+
+    public function initLegend()
+    {
+        $this->legend = $this->defaultLegend();
+    }
+
+    private function defaultLegend()
+    {
+        return [
+            'show' => true,
+            'position' => 'bottom',
+            'horizontalAlign' => 'center',
+        ];
+    }
+
+    public function setLegendVisibility($visible)
+    {
+        data_set($this->legend, 'show', $visible);
+
+        return $this;
+    }
+
+    protected function legendToArray()
+    {
+        return [
+            'legend' => $this->legend,
+        ];
+    }
+
+    protected function legendFromArray($array)
+    {
+        $this->legend = data_get($array, 'legend', $this->defaultLegend());
+    }
+}
diff --git a/src/Models/HasStrokeConfiguration.php b/src/Models/HasStroke.php
similarity index 73%
rename from src/Models/HasStrokeConfiguration.php
rename to src/Models/HasStroke.php
index 428c912..54cb923 100644
--- a/src/Models/HasStrokeConfiguration.php
+++ b/src/Models/HasStroke.php
@@ -4,15 +4,22 @@
 namespace Asantibanez\LivewireCharts\Models;
 
 
-trait HasStrokeConfiguration
+trait HasStroke
 {
     private $stroke;
 
-    public function __construct()
+    public function initStroke()
     {
         $this->stroke = $this->defaultStroke();
     }
 
+    private function defaultStroke()
+    {
+        return [
+            'curve' => 'straight',
+        ];
+    }
+
     public function setSmoothCurve()
     {
         data_set($this->stroke, 'curve', 'smooth');
@@ -27,15 +34,15 @@ trait HasStrokeConfiguration
         return $this;
     }
 
-    protected function setupStroke($array = [])
+    protected function strokeToArray()
+    {
+        return [
+            'stroke' => $this->stroke,
+        ];
+    }
+
+    protected function strokeFromArray($array)
     {
         $this->stroke = data_get($array, 'stroke', $this->defaultStroke());
     }
-
-    private function defaultStroke()
-    {
-        return [
-            'curve' => 'straight',
-        ];
-    }
 }
diff --git a/src/Models/LineChartModel.php b/src/Models/LineChartModel.php
index a1a217e..1188647 100644
--- a/src/Models/LineChartModel.php
+++ b/src/Models/LineChartModel.php
@@ -110,9 +110,4 @@ class LineChartModel extends BaseChartModel
 
         $this->markers = collect(data_get($array, 'markers', []));
     }
-
-    public function reactiveKey()
-    {
-        return md5(json_encode($this->toArray()));
-    }
 }
diff --git a/src/Models/PieChartModel.php b/src/Models/PieChartModel.php
index fe4639f..ebe0f36 100644
--- a/src/Models/PieChartModel.php
+++ b/src/Models/PieChartModel.php
@@ -7,7 +7,7 @@ namespace Asantibanez\LivewireCharts\Models;
  * Class PieChartModel
  * @package Asantibanez\LivewireCharts\Models
  */
-class PieChartModel
+class PieChartModel extends BaseChartModel
 {
     public $title;
 
@@ -21,6 +21,8 @@ class PieChartModel
 
     public function __construct()
     {
+        parent::__construct();
+
         $this->title = '';
 
         $this->animated = false;
@@ -74,17 +76,19 @@ class PieChartModel
 
     public function toArray()
     {
-        return [
+        return array_merge(parent::toArray(), [
             'title' => $this->title,
             'animated' => $this->animated,
             'onSliceClickEventName' => $this->onSliceClickEventName,
             'opacity' => $this->opacity,
             'data' => $this->data->toArray(),
-        ];
+        ]);
     }
 
     public function fromArray($array)
     {
+        parent::fromArray($array);
+
         $this->title = data_get($array, 'title', '');
 
         $this->animated = data_get($array, 'animated', false);
@@ -95,9 +99,4 @@ class PieChartModel
 
         $this->data = collect(data_get($array, 'data', []));
     }
-
-    public function reactiveKey()
-    {
-        return md5(json_encode($this->toArray()));
-    }
 }