mozilla / pdf.js

PDF Reader in JavaScript
https://mozilla.github.io/pdf.js/
Apache License 2.0
47.2k stars 9.82k forks source link

Marquee Zoom Feature #1260

Open Pheil opened 12 years ago

Pheil commented 12 years ago

A marquee zoom tool would be a useful feature. Having a zoom selection style similar to how "Print Edit 7.1" does their selection box is visually appealing.

yurydelendik commented 9 years ago

Sounds like a relatively simple tasks to implement -- just to follow steps in #3684. Also does not require knowing pdf.js internals. Setting good for beginner for now.

naumankhan commented 9 years ago

Hello Yury, The thread 3684 is about Grab to Pan. Which is working fine. Can you please tell how to achieve "Marquee Zoom" feature like you make a selection of some area in PDF and it zoom that specific area ( Vertically or Horizontally ) to fit in your screen

ghost commented 9 years ago

I want to work on this bug. How should I start? Do I have to modify viewer.js for this? I know how to make a selection area using a canvas (and displaying a crosshair). I'll have to figure out how to do that in PDF.js and also how to zoom in the selected text.

RahulMetangale commented 9 years ago

I am working on this feature and when I draw a rectangle using marquee zoom tool, i see that entire page turns blank. I am not sure if it is related to existing bugs https://github.com/mozilla/pdf.js/issues/5499 https://github.com/mozilla/pdf.js/issues/5392

My environment info: Windows 8.1 Browser: All browsers Used sample pdf that renders when viewer is opened. Latest build of pdf.js

I am not sure if it is because of existing issue i mentioned or i could be doing something wrong. Also is there a way to turn off text selection using code?

ghost commented 9 years ago

@RahulMetangale Sorry. But I have already done this part. I just have to do some small changes in it. And then I will send a pull request.

VikramN commented 9 years ago

Is this still open? I have quiet a few things done for this. Only main pending item is - how to scroll to a particular region in a page after zoom (scale has changed)? Is there any API for this? If not, any recommendations on best way to get zoomed-offset to display?

Pheil commented 8 years ago

@skjindal93 Any update on your pull request?

Pheil commented 7 years ago

@RahulMetangale or @VikramN any chance either of you got something working since @skjindal93 disappeared?

RahulMetangale commented 7 years ago

@Pheil No, i stopped working on this after @skjindal93's comment

ngramprabhu commented 7 years ago

@Pheil @RahulMetangale I am also in need of this feature.. Tried to pass on X & Y position in scrollPageIntoView method which returns left and top. But no luck in positioning the zoomed area in the view port. If you guys look at scrollPageIntoView you may get some idea...

vikasmahato commented 6 years ago

Hey is anyone still working on it??? If no one is working then can I take this issue?

timvandermeij commented 6 years ago

@vikasmahato I think nobody is working on this right now, so feel free to take it!

vikasmahato commented 6 years ago

@Pheil @timvandermeij Can you please guide me on how to start??

What I have understood so far is this:

  1. Create a selection using the mouse on the canvas.
  2. Get the content inside the selection
  3. Redraw the content so that it fills the visible canvas
timvandermeij commented 6 years ago

Take a look at how for example Adobe Reader/Acrobat does it. You need to be able to draw a rectangle around an area of interest, get the bounding box and zoom into that region. In web/app.js you can find how zooming works for a given percentage.

This tool is supposed to go into https://github.com/mozilla/pdf.js/blob/master/web/pdf_cursor_tools.js, where there is already some preparation for this; see https://github.com/mozilla/pdf.js/blob/master/web/pdf_cursor_tools.js#L21. Refer to that file also for how the other cursor tools work/are toggled.

vikasmahato commented 6 years ago

@timvandermeij I have implemented most of the stuff. Can you please tell me how can I draw the rectangle over the canvas? Do I have to use the overlayManager to do so?

yurydelendik commented 6 years ago

Can you please tell me how can I draw the rectangle over the canvas?

You don't have to draw a rectangle on a canvas. You can use css-styled div with border to show the rectangle.

Pheil commented 6 years ago

@vikasmahato I have a hack I added to my extension which might give you some ideas how to draw the rectangle.

https://github.com/Pheil/file-search-wx/blob/master/js/context_ss.js Looks like this ss

vikasmahato commented 6 years ago

@Pheil @yurydelendik @timvandermeij I have implemented both the drawing of a rectangle and zooming in. The only hurdle I am facing now is how to scroll to a particular region in a page after zoom. What is the best way to get the X and Y offsets of the scrollbar?

vikasmahato commented 6 years ago

@Pheil @yurydelendik @timvandermeij Can you please have a look at this PR and help me out with my previous query regarding setting the scrollbar position

himanish-star commented 6 years ago

@timvandermeij , I would like to solve this issue. Could I ?

timvandermeij commented 6 years ago

There is already a pull request above, but there is an open question there. Perhaps you could help out with that, or alternatively find a different issue to work on. Thanks.

Anu004 commented 4 years ago

@Pheil @yurydelendik @timvandermeij I have implemented both the drawing of a rectangle and zooming in. The only hurdle I am facing now is how to scroll to a particular region in a page after zoom. What is the best way to get the X and Y offsets of the scrollbar?

I'm facing this same issue. Is there any updates/improvements in this issue? I have to implement this zoom rectangle/marquee zoom in pdf.js viewer some how.

KalikiPranathi commented 4 years ago

Any updates on marquee zoom feature in pdf.js? Or is there any plugin/library to implement this feature.I need this feature in my application to view pdfs.

santoshprakash commented 3 years ago

any update on this feature