diff --git a/README.md b/README.md index b0141b0..17c2afc 100644 --- a/README.md +++ b/README.md @@ -131,12 +131,14 @@ The `line()` method allows you to add a value line to the metric. You can add mu ```php line( array|Closure $line, - string|array|Closure $color = '#7843E9' + string|array|Closure $color = '#7843E9', + string|array|Closure $type = 'line', ) ``` - `$line` - values for charting, -- `$color` - line color. +- `$color` - line color, +- `$type` - chart type (line, area, column) ```php use MoonShine\Apexcharts\Components\LineChartMetric; @@ -148,14 +150,14 @@ LineChartMetric::make('Orders') ->groupBy('date') ->pluck('sum','date') ->toArray() - ]) + ], type: fn() => 'area') ->line([ 'Avg' => Order::query() ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date') ->groupBy('date') ->pluck('avg','date') ->toArray() - ], '#EC4176') + ], '#EC4176', 'line'); ``` @@ -181,7 +183,9 @@ LineChartMetric::make('Orders') ->toArray() ],[ 'red', 'blue' - ]) + ], [ + type: ['area', 'line'] + ]); ``` ### Sorting keys diff --git a/resources/views/components/metrics/line.blade.php b/resources/views/components/metrics/line.blade.php index 9b50de7..6b7c6b8 100644 --- a/resources/views/components/metrics/line.blade.php +++ b/resources/views/components/metrics/line.blade.php @@ -3,6 +3,7 @@ 'lines' => [], 'colors' => [], 'labels' => [], + 'types', ])
merge(['class' => 'chart']) }} @@ -13,6 +14,7 @@ { name: '{{ $label }}', data: {{ json_encode(array_values($values)) }}, + type: '{{ $types[$loop->parent->index % count($types)][$loop->index % count($types[$loop->parent->index])] }}', }, @endforeach @endforeach diff --git a/resources/views/components/metrics/wrapped/line-chart.blade.php b/resources/views/components/metrics/wrapped/line-chart.blade.php index c8e9d2d..06ea2f8 100644 --- a/resources/views/components/metrics/wrapped/line-chart.blade.php +++ b/resources/views/components/metrics/wrapped/line-chart.blade.php @@ -5,6 +5,7 @@ 'colors' => [], 'columnSpanValue' => 12, 'adaptiveColumnSpanValue' => 12, + 'types' => [], ]) diff --git a/src/Components/LineChartMetric.php b/src/Components/LineChartMetric.php index 0de58ed..2d064c7 100644 --- a/src/Components/LineChartMetric.php +++ b/src/Components/LineChartMetric.php @@ -17,6 +17,8 @@ class LineChartMetric extends Metric protected array $colors = []; + protected array $types = []; + protected bool $withoutSortKeys = false; protected function assets(): array @@ -32,9 +34,11 @@ protected function assets(): array */ public function line( array|Closure $line, - string|array|Closure $color = '#7843E9' + string|array|Closure $color = '#7843E9', + string|array|Closure $type = 'line' ): static { - $this->lines[] = $line instanceof Closure ? $line() : $line; + $lines = $line instanceof Closure ? $line() : $line; + $this->lines[] = $lines; $color = $color instanceof Closure ? $color() : $color; @@ -44,12 +48,15 @@ public function line( $this->colors = $color; } - return $this; - } + $type = $type instanceof Closure ? $type() : $type; - public function getColor(int $index): string - { - return $this->colors[$index]; + if (is_string($type)) { + $this->types[][] = $type; + } else { + $this->types[] = $type; + } + + return $this; } public function getColors(): array @@ -72,6 +79,11 @@ public function getLines(): array return $this->lines; } + public function getTypes(): array + { + return $this->types; + } + public function withoutSortKeys(): static { $this->withoutSortKeys = true; @@ -93,6 +105,7 @@ protected function viewData(): array 'labels' => $this->getLabels(), 'lines' => $this->getLines(), 'colors' => $this->getColors(), + 'types' => $this->getTypes(), ]; } }