Prm-react-pdf-viewer NPM

prm-react-pdf-viewer

react pdf viewer along with text annotation, rectangle draw annotation

Install

npm install --save prm-react-pdf-viewer

Usage

import React, { Component } from 'react'

import { IPdfViewer, PdfViewer, PdfViewerOption } from 'prm-react-pdf-viewer'
import 'prm-react-pdf-viewer/dist/index.css'

class Example extends Component {
  const annotations =  [{ pageNumber:2, id:"1", quads:[{left:300, right:750, top: 1685, bottom: 1745}], pageResolution:{width: 4426,   height: 6138}, extraInfo:{showPopup: true, value: 'Abc'}}];
  
  const [pdfOptions, setPdfOption]= useState<PdfViewerOption>({
          docUrl:"/myPdf.pdf",
          annotations:annotations,
          initialZoomPercentage:50,
          color: {r:0, g:255, b: 0}
        }) ;
  render() {
    return <PdfViewer options={pdfOptions} onDocLoad={onDocLoad} />
  }
}