I am using jspdf library to generate pdf and I am unable to print images on the pdf.
here is my code:
require(['jquery','jsPDF'], function ($,jsPDF) {
var logo = 'https://rugs.a2hosted.com/pub/media/logo/stores/1/4.png';
$('.print_button_pdf').click(function (){
var lo = $('#pro').val();
var doc = new jsPDF();
var carName = $(".main_pro_title").html();
//doc.addImage(logo, 'PNG', 10, 10, 60, 15);
doc.setFontSize(12);
doc.text(150, 15,'Tel : +44 (0) 027-965-7366');
doc.line(0, 30, 600, 30);
doc.setFontSize(20);
//doc.setTextColor(255, 0, 0);
getDataUri(logo, function (logoUri) {
getDataUri(lo, function (dataUri) {
doc.addImage(logoUri, 'JPEG', 10, 10, 60, 15);
doc.text(10, 40,carName);
doc.addImage(dataUri, 'JPEG', 10, 50, 110, 80);
var kvi_start_top = 50;
var kvi_left_start_name = 130;
var kvi_left_start_value = 170;
var kvi_height_inc = 8;
//key vehicle information
doc.setFontSize(13);
doc.text(kvi_left_start_name, kvi_start_top,'KEY VEHICLE INFORMATION');
kvi_start_top +=10;
doc.setFontSize(10);
//kvi_brand
doc.text(kvi_left_start_name, kvi_start_top,'Brand');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_brand").val());
kvi_start_top +=kvi_height_inc;
//kvi_body_type
doc.text(kvi_left_start_name, kvi_start_top,'Body Type');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_body_type").val());
kvi_start_top +=kvi_height_inc;
//kvi_color
doc.text(kvi_left_start_name, kvi_start_top,'Colour');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_color").val());
kvi_start_top +=kvi_height_inc;
//kvi_engine
doc.text(kvi_left_start_name, kvi_start_top,'Engine');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_engine").val());
kvi_start_top +=kvi_height_inc;
//kvi_fuel_type
doc.text(kvi_left_start_name, kvi_start_top,'Fuel Type');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_fuel_type").val());
kvi_start_top +=kvi_height_inc;
//kvi_location
doc.text(kvi_left_start_name, kvi_start_top,'Location');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_location").val());
kvi_start_top +=kvi_height_inc;
//kvi_miles
doc.text(kvi_left_start_name, kvi_start_top,'Miles');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_miles").val());
kvi_start_top +=kvi_height_inc;
//kvi_owners
doc.text(kvi_left_start_name, kvi_start_top,'Owners');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_owners").val());
kvi_start_top +=kvi_height_inc;
//kvi_registration
doc.text(kvi_left_start_name, kvi_start_top,'Registration');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_registration").val());
kvi_start_top +=kvi_height_inc;
//kvi_trans
doc.text(kvi_left_start_name, kvi_start_top,'Transmission');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_trans").val());
kvi_start_top +=kvi_height_inc;
//kvi_year
doc.text(kvi_left_start_name, kvi_start_top,'Year');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_year").val());
kvi_start_top +=kvi_height_inc;
//kvi_price
doc.text(kvi_left_start_name, kvi_start_top,'Price');
doc.text(kvi_left_start_value, kvi_start_top,$("#kvi_price").val());
kvi_start_top +=kvi_height_inc;
//features list
//Features
var desc_start = kvi_start_top+15;
doc.setFontSize(13);
doc.text(10, desc_start,'Features');
doc.setFontSize(9);
var line_one_start_top = desc_start +5;
var line_start_left = 10;
var line_item_inc = 50;
var features = $(".kvi_featrues");
//contact
var conatct_start = line_one_start_top+15;
doc.setFontSize(13);
doc.text(10, conatct_start,'Contact');
doc.setFontSize(11);
conatct_start +=5;
doc.text(10, conatct_start,'LONDON & ESSEX');
conatct_start +=5;
doc.text(10, conatct_start,'TEL. 0207 965 7366');
conatct_start +=5;
doc.setFontSize(10);
doc.text(10, conatct_start,'www.jaguarwarehouse.co.uk');
conatct_start +=5;
doc.text(10, conatct_start,'[email protected]');
conatct_start +=5;
doc.save(carName+'.pdf');
});});
});
});
function getDataUri(url, callback) {
console.log(url);
var image = new Image();
image.setAttribute("crossOrigin", "https://rugs.a2hosted.com");
image.onload = function () {
var canvas = document.createElement('canvas');
canvas.width = this.naturalWidth;
canvas.height = this.naturalHeight;
canvas.getContext('2d').drawImage(this, 0, 0);
callback(canvas.toDataURL('image/png'));
};
image.src = url;
}
Any help would be appreciated.