How to Create Google Charts in Laravel 9 Tutorial Example ?

Today now in this post , I will show you an example of how to work laravel 9 google charts. So here I will explained this very simply about the dynamic google charts in laravel 9 application. Now this article is goes in details about how to use google charts in laravel 9 application. Do you have any question about the how to add google in laravel 9 application then here I will give a very simple example also with a solution. Alright, let’s start and follow the steps.

We can simply use the Line Charts, Bar Charts, Pie Charts, Area Charts, etc by using the google chart library js.

Now in this example, i will create a line chart with all months of current years. so let’s start and follow the below step and then add a chart in your own laravel 9 application.

Step 1: Install Laravel 9

This is first step but this step is optional; however, if you do not have then need to created the laravel app. then you may go ahead and then execute the below command:

composer create-project laravel/laravel example-app

Step 2: Create Route

Then at first of all i will create the simple route for creating the simple line chart. So let’s need to add simple routes as like as bellow:


use Illuminate\Support\Facades\Route;
use App\Http\Controllers\GoogleChartController;
| Web Routes
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
Route::get('chart', [GoogleChartController::class, 'index']);

Step 3: Create Controller

Now here, i will create a new controller as GoogleChartController. So let’s add the bellow code on that controller file.


namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\User;
use DB;
class GoogleChartController extends Controller
     * Write code on Method
     * @return response()
    public function index()
        $users = User::select(DB::raw("COUNT(*) as count"), DB::raw("MONTHNAME(created_at) as month_name"))
                    ->whereYear('created_at', date('Y'))
                    ->pluck('count', 'month_name');
        return view('chart', compact('users'));

Step 4: Create Blade File:

Now in the last step, i have to create the blade file and in this blade file i will use google js and also use their code.


<!DOCTYPE html>
    <title>Laravel 9 Google Chart Example -</title>
    <h1>Laravel 9 Google Chart Example -</h1>
    <div id="google-line-chart" style="height: 500px"></div>
<script type="text/javascript" src=""></script>
<script type="text/javascript">
    google.charts.load('current', {'packages':['corechart']});
    function drawChart() {
    var data = google.visualization.arrayToDataTable([
        ['Month Name', 'Register Users Count'],
                foreach($users as $key => $value) {
                    echo "['".$key."', ".$value."],";
    var options = {
      title: 'Register Users Month Wise',
      curveType: 'function',
      legend: { position: 'bottom' }
      var chart = new google.visualization.LineChart(document.getElementById('google-line-chart'));
      chart.draw(data, options);
Run Laravel App:

That’s good all the required steps have been complete, now we have to type the given below command and hit the enter to run the Laravel app:

php artisan serve

Read Also: How To Implement Laravel 9 form validation ?

Thanks for read. I hope it help you. For more you can follow us on facebook


About Shahriar Sagor

My name is Shahriar sagor. I'm a developer. I live in Bangladesh and I love to write tutorials and tips that will help to other Developer's. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.

View all posts by Shahriar Sagor →