Image not showing when generating pdf in angularjs using pdfmake

Shuvro picture Shuvro · Feb 21, 2015 · Viewed 12.6k times · Source

I'm using pdfmake, a nice pdf printing library in javascript to generate pdf in my angularjs SPA. Everything is working fine when I'm using only texts. The pdf is showing correctly with all texts in place. But it isn't working for me when I'm trying to show images. No error, no empty pdf, just nothing happens. There's no 404 either.

Here's the code I'm trying right now,

var dd = {
        content: [
            {
                image: 'picture13438908025659.jpg'
            },
            {
                text: 'Patient\'s Detail', fontSize: 18, bold: true
            },
            {
                columns: [
                    {
                        text: 'Patient\'s ID: ' + $scope.prescription.Patient[0].id, bold: false
                    },
                    {
                        text: 'Name: ' + $scope.prescription.Patient[0].name, bold: false
                    },
                    {
                        text: 'Age: ' + $scope.prescription.Patient[0].age, bold: false
                    },
                    {
                        text: 'Contact: ' + $scope.prescription.Patient[0].contact, bold: false
                    }
                ]

            },
            {
                text: 'Address: ' + $scope.prescription.Patient[0].address, bold: false
            }
        ]
    }

Answer

Mohideen bin Mohammed picture Mohideen bin Mohammed · Apr 9, 2016

Its Simple,

1) Convert your Image into base64 here

2) copy your base64 code and replace into ,

image : 'base64', // use your base64 instead image.jpg

3) Done. this method is if your image is not worked by link means use base64 instead