Search results

PdfGraphics API in JavaScript Pdf Export API control

PdfGraphics class represents a graphics context of the objects. It’s used for performing all the graphics operations.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// add a new page to the document
let page1 : PdfPage = document.pages.add();
// set the font
let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);
// create black brush
let blackBrush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));
//
//graphics of the page
let page1Graphics : PdfGraphics = page1.graphics;
// draw the text on the page1 graphics
page1Graphics.drawString('Hello World', font, blackBrush, new PointF(0, 0));
//
// save the document
document.save('output.pdf');
// destroy the document
document.destroy();

Methods

drawArc

Draws the specified arc, using its original physical size, at the location specified by a coordinate pair.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// add a page to the document.
let page1 : PdfPage = document.pages.add();
let pen : PdfPen = new PdfPen(new PdfColor(255, 0, 0));
// draw the path
page1.graphics.drawArc(pen, 10, 10, 100, 200, 90, 270);
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();

Returns void

drawImage

Draws the specified image, using its original physical size, at the location specified by a coordinate pair.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// add a page to the document.
let page1 : PdfPage = document.pages.add();
// base64 string of an image
let imageString : string = '/9j/3+2w7em7HzY/KiijFw … 1OEYRUYrQ45yc5OUtz/9k=';
// load the image from the base64 string of original image.
let image : PdfBitmap = new PdfBitmap(imageString);
//
// draw the image
page1.graphics.drawImage(image, 10, 10);
//
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
image PdfImage PdfImage to draw.
x number The x-coordinate of the upper-left corner of the drawn image.
y number The y-coordinate of the upper-left corner of the drawn image.

Returns void

drawImage

Draws the specified image, using its original physical size, at the location specified by a coordinate pair.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// add a page to the document.
let page1 : PdfPage = document.pages.add();
// base64 string of an image
let imageString : string = '/9j/3+2w7em7HzY/KiijFw … 1OEYRUYrQ45yc5OUtz/9k=';
// load the image from the base64 string of original image.
let image : PdfBitmap = new PdfBitmap(imageString);
//
// draw the image
page1.graphics.drawImage(image, 0, 0, 100, 100);
//
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
image PdfImage PdfImage to draw.
x number The x-coordinate of the upper-left corner of the drawn image.
y number The y-coordinate of the upper-left corner of the drawn image.
width number Width of the drawn image.
height number Height of the drawn image.

Returns void

drawLine

Draws a line connecting the two points specified by the coordinate pairs.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
//
// draw the line
page1.graphics.drawLine(new PdfPen(new PdfColor(0, 0, 255)), new PointF(10, 20), new PointF(100, 200));
//
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
pen PdfPen Color of the line.
point1 PointF PointF structure that represents the first point to connect.
point2 PointF PointF structure that represents the second point to connect.

Returns void

drawLine

Draws a line connecting the two points specified by the coordinate pairs.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
//
// draw the line
page1.graphics.drawLine(new PdfPen(new PdfColor(0, 0, 255)), 10, 20, 100, 200);
//
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
pen PdfPen Color of the line.
x1 number The x-coordinate of the first point.
y1 number The y-coordinate of the first point.
x2 number The x-coordinate of the second point.
y2 number The y-coordinate of the second point.

Returns void

drawPath

Draws the specified path, using its original physical size, at the location specified by a coordinate pair.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// add a page to the document.
let page1 : PdfPage = document.pages.add();
//Create new PDF path.
let path : PdfPath = new PdfPath();
//Add line path points.
path.addLine(new PointF(10, 100), new PointF(10, 200));
path.addLine(new PointF(100, 100), new PointF(100, 200));
path.addLine(new PointF(100, 200), new PointF(55, 150));
// set pen
let pen : PdfPen = new PdfPen(new PdfColor(255, 0, 0));
// set brush
let brush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));
// draw the path
page1.graphics.drawPath(pen, brush, path);
//
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
pen PdfPen Color of the text.
brush PdfBrush Color of the text.
path PdfPath Draw path.

Returns void

drawRectangle

Draws a rectangle specified by a pen, a coordinate pair, a width, and a height.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// create pen for draw rectangle
let pen : PdfPen = new PdfPen(new PdfColor(238, 130, 238));
//
// draw rectangle
page1.graphics.drawRectangle(pen, 10, 10, 50, 100);
//
// save the document
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
pen PdfPen Color of the rectangle.
x number The x-coordinate of the upper-left corner of the rectangle to draw.
y number The y-coordinate of the upper-left corner of the rectangle to draw.
width number Width of the rectangle to draw.
height number Height of the rectangle to draw.

Returns void

drawRectangle

Draws a rectangle specified by a brush, coordinate pair, a width, and a height.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// create brush for draw rectangle
let brush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(238, 130, 238));
//
// draw rectangle
page1.graphics.drawRectangle(brush, 10, 10, 50, 100);
//
// save the document
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
brush PdfBrush Color of the rectangle.
x number The x-coordinate of the upper-left corner of the rectangle to draw.
y number The y-coordinate of the upper-left corner of the rectangle to draw.
width number Width of the rectangle to draw.
height number Height of the rectangle to draw.

Returns void

drawRectangle

Draws a rectangle specified by a pen, a coordinate pair, a width, and a height.

// create a new PDF document.
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// create brush for draw rectangle
let brush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(238, 130, 238));
// set pen
let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));
//
// draw rectangle
page1.graphics.drawRectangle(pen, brush, 10, 10, 50, 100);
//
// save the document
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
pen PdfPen A Pen that determines the color, width, and style of the rectangle.
brush PdfBrush Color of the rectangle.
x number The x-coordinate of the upper-left corner of the rectangle to draw.
y number The y-coordinate of the upper-left corner of the rectangle to draw.
width number Width of the rectangle to draw.
height number Height of the rectangle to draw.

Returns void

drawRoundedRectangle

Draw rounded rectangle specified by a brush, pen, coordinate pair, a width, a height and a radius.

// Create a new PDF document.
let document : PdfDocument = new PdfDocument();
// Create a new page
let page : PdfPage = document.pages.add();
// Create brush for draw rectangle
let brush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(238, 130, 238));
// Create a new PDF pen
let pen: PdfPen = new PdfPen(new PdfColor(255, 0, 0), 1);
// Draw rounded rectangle
page.graphics.drawRoundedRectangle(pen, brush, 20, 20, 100, 50, 5);
// save the document
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
pen PdfPen Stoke color of the rectangle.
brush PdfBrush Fill color of the rectangle.
x number The x-coordinate of the upper-left corner of the rectangle to draw.
y number The y-coordinate of the upper-left corner of the rectangle to draw.
width number Width of the rectangle to draw.
height number Height of the rectangle to draw.
radius number Radius of the arcs to draw.

Returns void

drawString

Draws the specified text at the specified location and size with string format.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// add a pages to the document
let page1 : PdfPage = document.pages.add();
// set font
let font : PdfStandardFont = new PdfStandardFont(PdfFontFamily.Helvetica, 20);
// set pen
let pen : PdfPen = new PdfPen(new PdfColor(255, 0, 0));
// set brush
let brush : PdfSolidBrush = new PdfSolidBrush(new PdfColor(0, 0, 0));
// set rectangle bounds
let rectangle : RectangleF = new RectangleF({x : 10, y : 10}, {width : 200, height : 200});
// set the format for string
let stringFormat : PdfStringFormat = new PdfStringFormat();
// set the text alignment
stringFormat.alignment = PdfTextAlignment.Center;
// set the vertical alignment
stringFormat.lineAlignment = PdfVerticalAlignment.Middle;
//
// draw the text
page1.graphics.drawString('Hello World', font, pen, brush, rectangle, stringFormat);
//
// save the document
document.save('output.pdf');
// destroy the document
document.destroy();

Returns void

rotateTransform

Applies the specified rotation to the transformation matrix of this Graphics.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// create pen
let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));
//
// set RotateTransform with 25 degree of angle
page1.graphics.rotateTransform(25);
//
// draw the rectangle after RotateTransformation
page1.graphics.drawRectangle(pen, new RectangleF({x : 100, y : 100}, {width : 100, height : 50}));
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
angle number Angle of rotation in degrees.

Returns void

save

Saves the current state of this Graphics and identifies the saved state with a GraphicsState.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// create pen
let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));
//
// save the graphics state
let state1 : PdfGraphicsState = page1.graphics.save();
//
page1.graphics.scaleTransform(1.5, 2);
// draw the rectangle
page1.graphics.drawRectangle(pen, new RectangleF({x : 100, y : 100}, {width : 100, height : 50}));
// restore the graphics state
page1.graphics.restore(state1);
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();

Returns PdfGraphicsState

scaleTransform

Applies the specified scaling operation to the transformation matrix of this Graphics by prepending it to the object’s transformation matrix.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// create pen
let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));
//
// apply scaling trasformation
page1.graphics.scaleTransform(1.5, 2);
//
// draw the rectangle after applying scaling transform
page1.graphics.drawRectangle(pen, new RectangleF({x : 100, y : 100}, {width : 100, height : 50}));
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
scaleX number Scale factor in the x direction.
scaleY number Scale factor in the y direction.

Returns void

translateTransform

Used to translate the transformation.

// create a new PDF document
let document : PdfDocument = new PdfDocument();
// create a new page
let page1 : PdfPage = document.pages.add();
// set pen
let pen : PdfPen = new PdfPen(new PdfColor(0, 0, 0));
//
// set translate transform
page1.graphics.translateTransform(100, 100);
//
// draw the rectangle after applying translate transform
page1.graphics.drawRectangle(pen, new RectangleF({x : 0, y : 0}, {width : 100, height : 50}));
// save the document.
document.save('output.pdf');
// destroy the document
document.destroy();
Parameter Type Description
offsetX number The x-coordinate of the translation.
offsetY number The y-coordinate of the translation.

Returns void