Replies: 1 comment
-
Please guideline me which Api and how to set the settings. |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Is the feature relevant to the Firefox PDF Viewer?
No
Feature description
Unable show the words in Chinese whiling translated into canvas
I would like to show the canvas within Chinese.
I had been dropped the pdf which name is demo.pdf that show numbers only.
Please guideline me which Api and settings.
import React, { useRef } from 'react';
import * as pdfjsLib from 'pdfjs-dist';
pdfjsLib.GlobalWorkerOptions.workerSrc =
//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjsLib.version}/pdf.worker.min.js
;function Container(_, ref) {
const createAttribute = useRef(null);
const canvRef = useRef();
const onDragStartChange = async (event) => {
event.preventDefault();
const files = Array.from(event.dataTransfer.files);
// //todo 支持多个
const oo = U
RL.createObjectURL(files[0]);
const loadingTask = await pdfjsLib.getDocument(oo);
const source = await loadingTask.promise;
const canvas = canvRef.current;
const pdf = source;
for (let i = 1; i <= pdf.numPages; i++) {
let page = await pdf.getPage(i);
let viewport = page.getViewport({ scale: 1.5 });
canvas.height = viewport.height;
canvas.width = viewport.width;
await page.render({
canvasContext: canvas.getContext('2d'),
viewport: viewport,
}).promise;
}
};
return (
<>
<div className="excel_upload" onDrop={(event) => onDragStartChange(event)}>
<input
type="file"
accept="pdf"
ref={createAttribute}
// onChange={onHandleChange}
/>
</>
);
}
export default Container;
Unable show the words in Chinese whiling translated into canvas
demo.pdf
Other PDF viewers
No response
Beta Was this translation helpful? Give feedback.
All reactions