asantibanez / livewire-charts

Neat Livewire Charts for your Laravel projects
MIT License
805 stars 120 forks source link

Define colors for multiLine LineChart #17

Closed maximiliandoerner closed 3 years ago

maximiliandoerner commented 3 years ago

Is it possible to define the colors of the lines in a multi line chart? If so, how do you do it? I tried to change the color of a graph by adding , ['color' => '#aa0000'] to every data of one series, sadly doesn't work. I have piechart next to this chart and would like to use the same colors for consistency. (See the images for visualization) image image

The code of these graphs is this:

//PieChart
$accountSplitChart = (new PieChartModel())
            ->setTitle(_i('User by Type'))
            ->setOpacity(1)
            ->addSlice(_i('Employees and admins'), count(User::whereUserType(0)->get()), '#944ebd')
            ->addSlice(_i('Trainees'), count(User::whereUserType(1)->get()), '#76bd4e')
            ->addSlice(_i('Farmer'), count(User::whereUserType(2)->get()), '#bd714e');
//MultiLineChart
$traineesAndFarmerByDay = (new LineChartModel())
            ->setTitle('Trainees and Farmer in the last 7 days')
            ->multiLine()
            ->setSmoothCurve()
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(7)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(7)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(6)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(6)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(5)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(5)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(4)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(4)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(3)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(3)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(2)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(2)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->subDays(1)->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->subDays(1)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Trainees', Carbon::now()->format('d.m.Y'), count(Trainee::whereDate('created_at', Carbon::now()->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(7)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(7)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(6)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(6)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(5)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(5)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(4)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(4)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(3)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(3)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(2)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(2)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->subDays(1)->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->subDays(1)->format('Y-m-d'))->get()))
            ->addSeriesPoint('Farmer', Carbon::now()->format('d.m.Y'), count(Farm::whereDate('created_at', Carbon::now()->format('Y-m-d'))->get()));

I want to change the turquoise line to the brown shade to the pie chart, same for the other one, where it's blue to green. Would be helpful for anyone who doesn't want to stick with the default color.

daviddarke commented 3 years ago

👋 This would be great!

asantibanez commented 3 years ago

Hi @daviddarke @maximiliandoerner

This has been added in the latest release.

Thanks for checking out the package!

maximiliandoerner commented 3 years ago

@asantibanez Thanks works perfectly 👍 💯