BytescoutPDF.js documentation:
What is BytescoutPDF.js? This script made with pure javascript code allows you to generate PDF documents with text, images, and drawings.
No server-side code is required
SAMPLE CODE (see /Examples/ folder for more samples):
ONLINE DEMO SAMPLES (the copy from /Examples/ in the downloadable script)
- Add image from canvas
- Add image from URL
- Using alpha channel for graphics
- Drawing symbols in PDF
- Drawing PDF invoice with table and logo
- Drawing lines in PDF
- Drawing rectangles in PDF
- Writing text with German umlauts symbols
- Setting the header and the footer for pages in PDF
- Using HTML formatting for text in PDF
- Rotating images in PDF
- Adding outlines with bookmarks to pages and http links in PDF
- Setting page orientation in PDF
- Setting page size in PDF
- Set PDF document properties (title, keywords, author etc)
- Setting font name for text in PDF
- Setting font style for text in PDF
- Setting align for text in PDF
- Drawing text as columns in PDF
- Drawing images, lines with different colors, text with formatting
- Using rich text formatting for PDF
- Rotating text in PDF
- Wrapping text in PDF
Please make sure you are viewing BytescoutPDF.js samples through a local server, not just by opening the html file from folder
To run a local server:
- if you don't know how to run local server then download free Mangoose server for Windows from http://code.google.com/p/mongoose/
- copy mongoose.exe into the sample folder and run it by double-clicking. This will make this folder available as http://localhost:8080/
- then open http://localhost:8080/ in the browser and browse samples
Main class: BytescoutPDF
BytescoutPDF class methods and properties:
Document:
-
propertiesSet(title, subject, keywords, author, creator) - sets PDF document properties.
Available parameters are:
- title - Title of the document, this is displayed in Title field in PDF document properties
- subject - Subject of the document, this is displayed in Subject field in PDF document properties
- keywords - List of keywords for the document, this is displayed in Keywords field in PDF document properties
- author - Author of the document, this is displayed in Author field in PDF document properties
- creator - Creator of the document, this is displayed in Creator field in PDF document properties
-
addAnchor(Name, Page, Offset) - adds anchor that may be referenced by links or bookmarks.
COMMENTS: see "html-formatting-and-links" source code example.
-
addBookmark(Parent, Title, Link) - adds document bookmark (outline). Parent - parent bookmark (bookmarks can be nested), Title - bookmark display text, Link - document position, anchor or external link to go to.
COMMENTS: see "html-formatting-and-links" source code example.
-
onload() - onload event that should be set to function to fire when PDF generation has been done.
COMMENTS: see source code samples for more information
-
onHeader() - onHeader event that should be set to function that will be called for every document page to set the page header.
COMMENTS: see "header-footer" source code example.
-
onFooter() - onFooter event that should be set to function that will be called for every document page to set the page footer.
COMMENTS: see "header-footer" source code example.
-
getBase64Text() - returns generated PDF document in base64 encoded form (so this can be passed to datauri or to Downloadify to view or download PDF to end user.
COMMENTS: this function should be called on onload() event to make sure PDF generation has been done completely (especially if you are using images)
-
showBytescoutLink - bool property (true by default) that controls if the "powered by" link to ByteScout.com is shown at the bottom of the page or not. Set to False to disable the footer
-
ForceJPEGForImages - bool property (true by default) to force JPEG compression for all images (including canvas based images).
-
JPEGQuality - float property (0.95 by default) that controls the JPEG quality ratio for JPEG compression. Lesser value makes lesser file size, larger value increases file size but provides higher quality. Can be from 0.01 to 0.99 or 1.00 (max JPEG compression quality).
-
stopOnInvalidImages - controls if BytescoutPDFFatalError exception throws on invalid or not downloaded (due to network issues) images (True by default. Set to False to silently skip invalid images and write messages to the console log only).
You may handle BytescoutPDFFatalError exception like this:
try {/* your code */} catch(exc){ if(exc instanceof ByteScoutPDFFatalError) {/* handle bytescout pdf script exception here */}
Page:
-
pageAdd() - adds new page (and this new page becomes current page).
-
pageSetIndex() - sets the current page.
-
pageSetOrientation(orientation) - sets page orientation (default is portrait orientation).
Possible values are: BytescoutPDF.PORTRAIT, BytescoutPDF.LANDSCAPE
-
pageSetSize(pageSizeIndex) - changes size for the current page using predefined page size index. Default size is A4.
Available values are:
- BytescoutPDF.A0 = 33.125x46.75 inches, 2385x3366 pixels (72 dpi)
- BytescoutPDF.A1 = 23.375x33.125 inches, 1683x2385 pixels (72 dpi)
- BytescoutPDF.A2 = 16.5x23.375 inches, 1188x1683 pixels (72 dpi)
- BytescoutPDF.A3 = 11.75x16.5 inches, 846x1188 pixels (72 dpi)
- BytescoutPDF.A4 = 8.25x11.75 inches, 594x846 pixels (72 dpi)
- BytescoutPDF.A5 = 5.875x8.25 inches, 423x846 pixels (72 dpi)
- BytescoutPDF.A6 = 4.125x5.875 inches, 297x423 pixels (72 dpi)
- BytescoutPDF.A7 = 2.875x4.125 inches, 207x423 pixels (72 dpi)
- BytescoutPDF.Letter = 8.5x11 inches, 612x792 pixels (72 dpi)
- BytescoutPDF.Legal = 8.5x14 inches, 612x1080 pixels (72 dpi)
- BytescoutPDF.Executive = 7.25x10.5 inches, 522x756 pixels (72 dpi)
- BytescoutPDF.JisB5 = 7.125x10.125 inches, 513x729 pixels (72 dpi)
For CUSTOM sizes please use .pageSetWidth(width) and .pageSetHeight(height) functions
-
pageSetWidth(width) - sets width of the current page in inches (default is 8.25 inches, A4 ). To get pixels just multiply value in inches to 72 (default PDF dpi). For 10 inches you get 720 pixels, for 5.5 inches you get 396 pixels etc.
-
pageSetHeight(height) - sets height of the current page (default is 11.75 inches, A4 size). To get pixels just multiply value in inches to 72 (default PDF dpi). For 10 inches you get 720 pixels, for 5.5 inches you get 396 pixels etc.
-
addLink(X, Y, Width, Height, Link) - adds a box link at specified rectangle with target. Parent - parent bookmark (bookmarks can be nested), Title - bookmark display text, Link - document position, anchor or external link to go to.
COMMENTS: see "html-formatting-and-links" source code example.
Font and style:
-
fontSetName(fontName) - selects currently used font for text from one of 14 PDF built-in fonts.
Available font names are: Times-Roman, Helvetica, Courier, Symbol, ZapfDingbats
You can use bold, italic, or mixed styles for fonts with fontSetStyle() function, see below
-
fontSetSize(fontSize) - sets size in points for the currently selected font
-
fontSetStyle(bold, italic, underline) - controls style of the current font, you can set style for new text with bold, italic, inderline parameters
-
fontSetColor(R,G,B) - changes font color using RGB format (where each component is 0..255). Default font color is black (0,0,0)
-
textSetLinkStyle(Underline,R,G,B) - changes links style using the underline state and the color in RGB format.
Text output (single line)
-
textAdd(x,y,text,angle) - draws single text line starting at (x,y) with optional rotation (if you don want to rotate then pass angle as 0 (zero)
RICH TEXT FORMATTING support: you can use <b> <⁄b> and <i> <⁄i> tags to set italic and bold styles in text
Text output (multiline)
-
textSetBox(x,y,width,height) - sets a rectangle area box for multiline text output
-
textSetAlign(textAlign) - sets text align for multiline text output.
Available values are: BytescoutPDF.LEFT, BytescoutPDF.JUSTIFIED, BytescoutPDF.RIGHT, BytescoutPDF.CENTER
-
textAddToBox(text, newline) - adds text into multline text box (defined with textSetBox(x,y,width,height). Set newline parameter to true if you want to start from new line.
RICH TEXT FORMATTING support: you can use <b> <⁄b> and <i> <⁄i> tags to set italic and bold styles in text
RETURNS: result object with the following properties:
-
.bottomY property which indicates bottom Y of the last text. This is useful as you could use this result.bottomY to check the actual end position of text you just added to the box
-
.end property contains True (whole given text has been drawn to output PDF) or False (only partition of the given text has been drawn to PDF)
-
setInterline(interline) - sets vertical interline space for multiline text output
-
textFitsBox(text) - evaluates if text string will fit into the current mutline text box
RETURNS: true if text will fit the box, false otherwise. This function is useful to check if we should start a new multiline text box or use current one
-
textSetBoxPadding(leftPadding, topPadding, rightPadding, bottomPadding) - sets padding (margings) for text output inside the defined text box
Images:
-
imageLoadFromUrl(imageSrc) - loads image from URL and sets this image as currently active image.
COMMENTS: you may have issues with loading images from another domain as this can be limited by the browser security.
-
imageLoadFromCanvas(canvas) - loads image from given canvas object and makes this image currently selected image.
-
imagePlace(x,y,angle) - places currently active image into PDF at given coordinates (x,y) rotated at given angle (pass 0 (zero) to place without rotation)
-
imagePlaceSetSize(x,y,angle,width,height) - places currently active image into PDF at given coordinates (x,y) rotated at angle (pass 0 (zero) to place without rotation) and with specified width and height.
-
imageSetDefaultBackgroundColor(R,G,B) - sets default background color for semitransparent images in RGB format. Default is white color (255,255,255)
Lines and graphics:
-
graphicsSetColor(R,G,B) - sets default color for graphics drawings in RGB format. Default is black (0,0,0)
-
graphicsSetAlpha(A) - sets alpha transparency for graphics drawings in RGB format. From 0 (transparent) to 255 (opaque). Default is 255.
-
graphicsSetLineWidth(width) - sets line width for lines drawings from 1 to 100.
-
graphicsDrawLine(startX, startY, endX, endY) - draws a line from (startX, startY) point to (endX, endY) point
-
graphicsSetLineEndType(lineType) - sets line ending type for line drawings
AVAILABLE values: BytescoutPDF.BUTT_CAP, BytescoutPDF.ROUND_CAP, BytescoutPDF.PROJECTING_SQUARE_CAP
-
graphicsDrawRectangle(x,y, width, height) - draws rectangle at given coordinates
-
graphicsDrawRectangleFill(x,y, width, height) - draws rectangle fill at given coordinates using the current graphics color