Laravel 7 Generate PDF with Graph

In this tutorial you will learn about the Laravel 7 Generate PDF with Graph and its application with practical example.

In this Laravel 7 Generate PDF with Graph tutorial, I’ll show you how to generate pdf with graph in laravel. In this tutorial you will learn to generate pdf file with graph in laravel.

Table Of Contents−

Laravel 7 Generate PDF with Graph

Step 1: Install wkhtmltopdf Software
Step 2: Download Laravel Fresh App
Step 3: Install mikehaertl/phpwkhtmltopdf

Step 4: Add Routes
Step 5: Create Controller by Command
Step 6: Create Blade View

Step 7: Run Development Server

Step 1: Install wkhtmltopdf Software

In thi step we will first install wkhtmltopdf software. Follow the instruction given below to install:

For Ubuntu:

sudo apt install wkhtmltopdf

1	sudo apt install wkhtmltopdf

for Windows:

You have go the following link and download exe. Then install it:

https://wkhtmltopdf.org/

1	https://wkhtmltopdf.org/

https://wkhtmltopdf.org/

1	https://wkhtmltopdf.org/

Step 2: Download Laravel Fresh App

First of all we need to create a fresh laravel project, download and install Laravel using the below command

composer create-project --prefer-dist laravel/laravel blog

1	composer create-project --prefer-dist laravel/laravel blog

Step 3: Install mikehaertl/phpwkhtmltopdf

In this step, we will install mikehaertl/phpwkhtmltopdf Package via the composer dependency manager. Use the following command to install mikehaertl/phpwkhtmltopdf Package.

composer require mikehaertl/phpwkhtmltopdf

1	composer require mikehaertl/phpwkhtmltopdf

Step 4: Add Routes

After this, we need to define routes in “routes/web.php” file. Lets open “routes/web.php” file and add the following routes in it.

routes/web.php

Route::get('graph', 'GraphPdfController@index');
Route::get('download', 'GraphPdfController@download')->name('download');

1 2	Route::get('graph', 'GraphPdfController@index'); Route::get('download', 'GraphPdfController@download')->name('download');

Step 5: Create Controller by Command

Now, lets create a controller named GraphPdfController using command given below –

php artisan make:controller GraphPdfController

1	php artisan make:controller GraphPdfController

This command will create a controller that name GraphPdfController.php.

Next go to app/Http/Controllers and open GraphPdfController.php. Then update the following methods into your controller file:

<?php
   
namespace App\Http\Controllers;
   
use Illuminate\Http\Request;
use mikehaertl\wkhtmlto\Pdf;
   
class GraphPdfController extends Controller
{
    /**
     * Write code on Construct
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        return view('graph');
    }
   
    /**
     * Write code on Construct
     *
     * @return \Illuminate\Http\Response
     */
    public function download()
    {
        $render = view('chart')->render();
   
        $pdf = new Pdf;
        $pdf->addPage($render);
        $pdf->setOptions(['javascript-delay' => 5000]);
        $pdf->saveAs(public_path('report.pdf'));
    
        return response()->download(public_path('report.pdf'));
    }
}

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use mikehaertl\wkhtmlto\Pdf;

class GraphPdfController extends Controller

{

/**

* Write code on Construct

* @return \Illuminate\Http\Response

public function index()

{

return view('graph');

}

/**

* Write code on Construct

* @return \Illuminate\Http\Response

public function download()

{

$render = view('chart')->render();

$pdf = new Pdf;

$pdf->addPage($render);

$pdf->setOptions(['javascript-delay' => 5000]);

$pdf->saveAs(public_path('report.pdf'));

return response()->download(public_path('report.pdf'));

}

Step 6: Create View File

Go to resources/views/ folder and create a new blade view file that name graph.blade.php file.

After that, update the following code into your graph.blade.php file:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="https://www.google.com/jsapi"></script>
    <style>
        .pie-chart {
            width: 600px;
            height: 400px;
            margin: 0 auto;
        }
        .text-center{
            text-align: center;
        }
    </style>
</head>
<body>
   
<h2 class="text-center">Generate PDF with Chart in Laravel</h2>
   
<div id="chartDiv" class="pie-chart"></div>
   
<div class="text-center">
    <a href="{{ route('download') }}">Download PDF File</a>
    <h2>w3adda.com.com</h2>
</div>
   
<script type="text/javascript">
    window.onload = function() {
        google.load("visualization", "1.1", {
            packages: ["corechart"],
            callback: 'drawChart'
        });
    };
   
    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Pizza');
        data.addColumn('number', 'Populartiy');
        data.addRows([
            ['Laravel', 33],
            ['Codeigniter', 26],
            ['Symfony', 22],
            ['CakePHP', 10],
            ['Slim', 9]
        ]);
   
        var options = {
            title: 'Popularity of Types of Framework',
            sliceVisibilityThreshold: .2
        };
   
        var chart = new google.visualization.PieChart(document.getElementById('chartDiv'));
        chart.draw(data, options);
    }
</script>
   
</body>
</html>

<!DOCTYPE html>

<html>

<head>

<style>

.pie-chart {

width: 600px;

height: 400px;

margin: 0 auto;

}

.text-center{

text-align: center;

}

</style>

</head>

<body>

<h2 class="text-center">Generate PDF with Chart in Laravel</h2>

<a href="{{ route('download') }}">Download PDF File</a>

</div>

window.onload = function() {

google.load("visualization", "1.1", {

packages: ["corechart"],

callback: 'drawChart'

});

};

function drawChart() {

var data = new google.visualization.DataTable();

data.addColumn('string', 'Pizza');

data.addColumn('number', 'Populartiy');

data.addRows([

['Laravel', 33],

['Codeigniter', 26],

['Symfony', 22],

['CakePHP', 10],

['Slim', 9]

]);

var options = {

title: 'Popularity of Types of Framework',

sliceVisibilityThreshold: .2

};

var chart = new google.visualization.PieChart(document.getElementById('chartDiv'));

chart.draw(data, options);

}

</script>

</body>

</html>

Step 7: Run Development Server

Now we are ready to run our example so lets start the development server using following artisan command –

php artisan serve

1	php artisan serve

Now, open the following URL in browser to see the output –

http://127.0.0.1:8000/graph

1	http://127.0.0.1:8000/graph

AngularJS

CodeIgniter

Laravel

Node Js

Wordpress

More Blog

Learn

ABOUT PAGES

Laravel 7 Generate PDF with Graph