现在有一个A4的横版图片,如何在打印的时候旋转成竖版的图片?
import {jsPDF} from 'jspdf';
import * as pdfjsLib from 'pdfjs-dist/build/pdf';
import 'pdfjs-dist/build/pdf.worker.mjs';
const imgUrl = '需要旋转的图片url';
// 1. 加载图片
const img = await loadImage(imgUrl);
// 2. 转换为PDF
const pdfBlob = await imageToPdf(img);
// 3. 旋转pdf转为图片blob
const imageBlob = await convertPdfToImageBlob(pdfBlob);
// 4. 转为图片地址
const imageUrl = URL.createObjectURL(imageBlob);
const loadImage = (url) => {
return new Promise((resolve, reject) => {
const img = new Image();
img.crossOrigin = 'Anonymous';
img.onload = () => resolve(img);
img.onerror = reject;
img.src = url;
});
};
const imageToPdf = (img) => {
return new Promise((resolve) => {
const pdf = new jsPDF({
orientation: img.width > img.height ? 'landscape' : 'portrait',
unit: 'px',
format: [img.width, img.height],
margins: {
top: 0,
left: 0,
right: 0,
bottom: 0,
},
});
pdf.addImage(img, 'JPEG', 0, 0, img.width, img.height);
const pdfBlob = pdf.output('blob');
resolve(pdfBlob);
});
};
const convertPdfToImageBlob = async (file) => {
const pdf = await pdfjsLib.getDocument(URL.createObjectURL(file)).promise;
const page = await pdf.getPage(1);
const viewport = page.getViewport({
scale: 1.0,
rotation: -90,
offsetX: 0,
offsetY: 0,
});
const canvas = document.createElement('canvas');
const context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
const renderContext = {
canvasContext: context,
viewport: viewport,
intent: 'print',
};
await page.render(renderContext).promise;
return new Promise((resolve) => {
canvas.toBlob((blob) => {
resolve(blob);
}, 'image/png');
});
};