Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Annotation Layer redering issue #1739

Open
4 tasks done
juancarlos-cynch opened this issue Mar 8, 2024 · 2 comments
Open
4 tasks done

Annotation Layer redering issue #1739

juancarlos-cynch opened this issue Mar 8, 2024 · 2 comments
Labels
bug Something isn't working

Comments

@juancarlos-cynch
Copy link

Before you start - checklist

  • I followed instructions in documentation written for my React-PDF version
  • I have checked if this bug is not already reported
  • I have checked if an issue is not listed in Known issues
  • If I have a problem with PDF rendering, I checked if my PDF renders properly in PDF.js demo

Description

When opening a PDF file with annotated info, the values are being shown misaligned.
I'm seeing this issue even in the library demos.

  • Using the react-pdf library:
    Screenshot 2024-03-08 at 09 55 45

  • Using any other PDF reader software:
    Screenshot 2024-03-08 at 09 55 00

Steps to reproduce

  1. Clone the react-pdf library
  2. Go to sample/vite/ folder and install the demo dependencies npm install
  3. Run the demo: npm run dev
  4. Choose the attached file in this issue, using the file selector and load a PDF file with annotations.
  5. See the misaligned data and compare opening the file with another PDF reader (like Mac Preview)

Expected behavior

The form values should be showed correctly aligned as any other PDF reader software.

Actual behavior

The form values are incorrectly aligned.

Additional information

Sample Demo: https://github.com/wojtekmaj/react-pdf/tree/main/sample/vite

Test File: f1040--2022 (1).pdf

Environment

  • Browser (if applicable):
  • React-PDF version: latest
  • React version: 18
  • Webpack version (if applicable):
@juancarlos-cynch juancarlos-cynch added the bug Something isn't working label Mar 8, 2024
@Yatin07
Copy link

Yatin07 commented Mar 22, 2024

I am also getting similar issues:-
PIC 1:- when selecting/clicking on hyperlinks, the layers are not alined with the original PDF text.
1ex

PIC 2:- original PDF.
2ex

Environment:-

  • React version: 17
  • React-PDF version: latest

@jigmeloday
Copy link

import 'react-pdf/dist/Page/TextLayer.css';
import 'react-pdf/dist/Page/AnnotationLayer.css';

you can import this two css which solved the issue but not sure where its good idea or not

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants