React-pdf: Altering Page height

[marlbones]

Hello! Firstly - love this package. It's a lifesaver. Secondly, apologies if this is an incredibly silly support question - I'm a bit of a web dev newbie.

I'm trying to create a "pdf preview" with a fixed width/height and am wondering how I can adjust the height of the Page component in the absence of a height prop? Passing an object to className doesn't seem to do the trick, nor does adding anything to style. Upon inspection, the <canvas> component is what I want to alter, however I'm at a bit of a loss on how to do so. Any advice would be very welcome.

[wojtekmaj]

Hello! Firstly - love this package. It's a lifesaver.

Glad to hear that. Really keeps me going! :)

Secondly, apologies if this is an incredibly silly support question - I'm a bit of a web dev newbie.

Never be sorry for that. There are no silly questions. We've all been there at some point!

So, to the point. That's really a thing that was overlooked for some reason by me. I could come up with some silly workaround, like:

• Getting data for each and every page on Document's onLoadSuccess (as you have access to pdf.getPage() you can theoretically do that)
• Calculating desired width for each page using width/height data
• Saving an array with all the widths to wrapper's state
• Rendering Pages with different widths

But I think we can agree it's insane. I'm implementing it right now so that if width is not defined, it falls back to height and THEN to 1.0 scale.

[wojtekmaj]

Check out 4.0.0-beta.2 :)

[marlbones]

Beautiful! Thank you! You're a legend!

[renrizzolo]

This will be handy for a page-fit function (stretching the page to the height of the viewport).
I was calculating the canvas aspect ratio, multiplying it by the viewport height then applying that to the width prop 😛

[wojtekmaj]

So many ideas :) As you can see, 686 commits and we as a community are nowhere near running out of ideas for improvements. Keep them coming (in separate issues 😄) :)