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
Uh oh!
There was an error while loading. Please reload this page.
-
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