How to use google pie chart in laravel 9 Framework


Google Charts provides a perfect way to visualize data on website. It is very easy to display dynamic data day-wise, month-wise, year-wise on google pie chart in Laravel.

Here at Fixwebnode, we shall look into how to implement google pie chart in Laravel 9 application.


1.  Install Laravel 9 Framework

To begin, you need to install the Laravel 9 Framework. You can do this by running the following command in your terminal:

$ composer create-project laravel/laravel your-project-name --prefer-dist

Now, Set up Database by creating or editing an .env file with the below information:



2. Create a Route

Next, you need to create a route for the google pie chart in your routes/web.php file. Add the following code to the file:

use App\Http\Controllers\GooglePieChartController;
Route::get('/google-pie-chart', 'GooglePieChartController@index');


3. Create Controller

Now, create a controller for the Google Pie Chart. To do this, run the following command in your terminal:

$ php artisan make:controller GooglePieChartController

This will create a controller file in the app/Http/Controllers directory.


4. Add Google Pie Chart Script

Next, you need to add the Google Pie Chart Script in the controller file. Add the following code to the controller:

public function index()
    $data = [
            "label" => "Fruits",
            "data" => [
            "label" => "Vegetables",
            "data" => [
    return view('google_pie_chart', compact('data'));


5. Create View

Now, create a view for the Google Pie Chart. To do this, create a file named google_pie_chart.blade.php in the resources/views/ directory and add the following code to it:

<!DOCTYPE html>
    <title>Google Pie Chart Demo</title>
    <script type="text/javascript" src=""></script>
    <script type="text/javascript">
        google.charts.load('current', {'packages':['corechart']});
        function drawChart() {
            var data = google.visualization.arrayToDataTable(<?php echo json_encode($data); ?>);
            var options = {
                title: 'Google Pie Chart',
                is3D: true
            var chart = new google.visualization.PieChart(document.getElementById('pie-chart'));
            chart.draw(data, options);
    <div id="pie-chart" style="width: 900px; height: 500px;"></div>


6. Testing

Finally, you can test the Google Pie Chart by visiting http://your-project-name.test/google-pie-chart in your browser. 


[Need help in fixing Laravel App issues ? We can help you. ]



Your Cart