I use PhantomJS for PDF generation.
This is my command:
./phantomjs rasterize.js <someurl> test.pdf
It generates pdf file but:
The PDF looks nothing like the original website
I can't set the page orientation
Also is there any other options I can use for pdf generation?
The following change to rasterize.js also doesn't seem to work:
{ format: system.args[3], orientation: 'Letter', margin: '1cm' }
Rasterize.js is a very basic example of screen capture. There are some default values in this example that you can change to your needs.
page.viewportSize
Simulates the size of the window like in a traditional browser. In rasterize.js, it's { width: 600, height: 600 } ; not a common resolution and you may need to change this.
page.paperSize
Defines the size of the web page when rendered as a PDF. There are two modes : Manual (given a width and a height) or automatic (given a format). Do not hesitate to read the webpage documentation and the wiki page.
In your case, orientation: 'Letter' is invalid.
Supported formats are 'A3', 'A4', 'A5', 'Legal', 'Letter', 'Tabloid'.
Supported orientation are 'portrait' and 'landscape'.
Take a look at the source code and change it to your needs !
Related
I do not get the syntax for resizing graphics in Quarto, could you please give me a hint. The following has no effect.
---
title: "resize image"
format: pdf
---
{fig-width=5}
{fig-width=10}
{fig-width=50%}
{fig-height=50%}
https://quarto.org/docs/reference/formats/pdf.html#figures
https://quarto.org/docs/authoring/figures.html
You can use width and height, as documented here.
---
title: "resize image"
format: pdf
---
{width=10%}
{height=50%}
You can also use px and in as the unit, or specify it between quotes:
{height=100px}
{height=2in}
{height="100"}
Why are fig-height and fig-width not working?
As stated in the document you cite, fig-height and fig-width are settings for the default size for figures generated by R or Matplotlib graphics.
Since your image is not generated by R or Matplotlib, you should use pandoc's attributes, as documented here.
I have a markdown document that I wish to output in pdf format. I cannot find a way to format the images correctly.
If I use
<center><img src="_images/parameter_form.png" alt="Select Parameters" width="400"></center>
I works perfectly with make html, but with make latexpdf the image does not appear at all.
If I use (based on this stack overflow answer)
 { width=400 }
The images is not sized and the format string { width=400 } appears in the text
What am I doing wrcng?
The answer is to use MyST. This Sphinx parser allows a richer syntax in markdown and specifically the image tag
```{image} _images/parameter_form.png
:alt: Select Parameters
:width: 400px
:align: center
```
Perfect!
I'm trying to export our graph in full size but it returns an empty image.
cy.png({"full": true})
returns
"data:,"
However, if I do this:
tmpImg.attr('src', cy.png({ "full": true, "output": "base64url", "maxWidth": 20000, "maxHeight": 20000, "bg": "#fff" }));
I get a nice image exported.
The problem is the maxwidth I'm specifying is too small. If I increase it, I get an empty image again.
Please see the related issue. It is because of limit on the size of file a browser can export.
What about changing the scale to something less than 1? This will reduce the quality, but might solve your problem.
Also there is an extension that exports the view as SVG. Alternatively you can try it (SVG will probably have smaller size). Looks like it is under development, and I do not know how well it works.
I am using pdf.js. Fetching the Text I get blocks with font info
Object {
str: "blabla",
dir: "ltr",
width: 191.433141,
height: 12.546,
transform: Array[6],
fontName: "g_d0_f2"
}
Is it possible to get somehow more information about g_d0_f2.
Notice the PDF.js getTextContent will not and not suppose to match glyphs in PDFs. The PDF32000 specification has two different algorithms for text display and extraction. Even if you can lookup font data in the page.commonObjs, it might not be really helpful for extracted text content display due to glyphs encoding mismatch.
The page's getTextContent is doing text extraction and getOperatorList gets (glyph) display operators. See how src/display/svg.js renderer displays glyphs.
I have a shipping/billing input form and I'm having trouble styling the input fields to be the same width...
The Problem:
-a field <input type="text" size="X" /> appears to render with different sizes in different browsers (see link).
-In addition, select fields seem to render on a differently as well.
-Chrome/safari do not seem to respond to the font-size property for select fields.
Any guidance on how to stylize the size of text-input and select fields cross-browser would be oh so very helpful.
Must I result to having a different sytlesheet for each browser... just for these input fields?
-thanks
Remove that inline "size" attribute, first. You should use CSS to style the input form:
input[type="text"] {
width: 100px;
/* You can also style padding, margins and everything else,
* just remember that inputs of type "text" can only be one line.
*/
}
Don't use [type="text"] as a selector. I was just using it in this example to associate with input fields of type "text", but it's not fully cross-browser supported. You should give your text input fields their own class to stylize with.
Also, don't forget your CSS reset to make sure your margins, borders, et. al. are reset for all browsers. http://meyerweb.com/eric/tools/css/reset/
Nowadays, it's possible to normalize the width of "sized" inputs, using the ch unit, which has reached a decent browser support.
Unfortunately, it's still not possible to write:
input[size] {
width: attr(size) "ch";
}
So we have to style the widths we know we'll be using:
input[size="10"] {width: 10ch;}
input[size="20"] {width: 20ch;}
input[size="30"] {width: 30ch;}
/* etc. */
This can easily be automated using a CSS preprocessor.
UPDATE:
I made a test fiddle. As of today (feb. 2018), this is working on Windows 10 with Chrome 63, Edge 41, FF 58. On IE 11, it fails. I haven't tried on OS X.