Pdf Component - PdfGraphics

30 Sep 202624 minutes to read

Represents a graphics from a PDF page.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
//Create a new pen.
let pen: PdfPen = new PdfPen({r: 0, g: 0, b: 0}, 1);
//Draw line on the page graphics.
graphics.drawLine(pen, {x: 10, y: 10}, {x: 100, y: 100});
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();

Properties

Get clientSize Size

Gets the size of the canvas reduced by margins and page templates (Read only).

Methods

drawArc

Draw arc on the page graphics.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access the first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
// Create a new pen
let pen: PdfPen = new PdfPen({r: 0, g: 0, b: 0}, 1);
// Draw an arc on the page graphics
graphics.drawArc({x: 10, y: 20, width: 100, height: 200}, 20, 30, pen);
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();
Parameter Type Description
bounds Rectangle The bounding rectangle that defines the ellipse from which the arc shape comes.
startAngle number Angle measured in degrees clockwise from the x-axis to the first side of the arc shape.
sweepAngle number Angle measured in degrees clockwise from the startAngle parameter to the second side of the arc shape.
pen PdfPen Pen that determines the stroke color, width, and style of the arc.

Returns void

drawBezier

Draws a Bezier curve using a specified pen and coordinates for the start point, two control points, and end point.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access the first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
// Create a new pen
let pen: PdfPen = new PdfPen({r: 0, g: 0, b: 0}, 1);
// Draw a Bezier curve on the page graphics
graphics.drawBezier({x: 50, y: 100}, {x: 200, y: 50}, {x: 100, y: 150}, {x: 150, y: 100}, pen);
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();
Parameter Type Description
start Point The (x, y) coordinates of the starting point of the Bezier curve.
first Point The (x, y) coordinates of the first control point of the Bezier curve.
second Point The (x, y) coordinates of the second control point of the Bezier curve.
end Point The (x, y) coordinates of the ending point of the Bezier curve.
pen PdfPen The pen that determines the stroke color, width, and style of the Bezier curve.

Returns void

drawEllipse

Draw ellipse on the page graphics.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access the first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
// Create a new pen
let pen: PdfPen = new PdfPen({r: 0, g: 0, b: 0}, 1);
// Draw an ellipse on the page graphics
graphics.drawEllipse({x: 10, y: 20, width: 100, height: 200}, pen);
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();
Parameter Type Description
bounds Rectangle The bounding rectangle that defines the ellipse.
pen PdfPen Pen that determines the stroke color, width, and style of the ellipse.

Returns void

drawEllipse

Draw ellipse on the page graphics.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access the first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
// Create a new brush
let brush: PdfBrush = new PdfBrush({r: 0, g: 255, b: 255});
// Draw an ellipse on the page graphics
graphics.drawEllipse({x: 10, y: 20, width: 100, height: 200}, brush);
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();
Parameter Type Description
bounds Rectangle The bounding rectangle that defines the ellipse.
brush PdfBrush Brush that determines the fill color and texture of the ellipse.

Returns void

drawEllipse

Draw ellipse on the page graphics.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access the first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
// Create a new pen
let pen: PdfPen = new PdfPen({r: 0, g: 0, b: 0}, 1);
// Create a new brush
let brush: PdfBrush = new PdfBrush({r: 0, g: 255, b: 255});
// Draw an ellipse on the page graphics
graphics.drawEllipse({x: 10, y: 20, width: 100, height: 200}, pen, brush);
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();
Parameter Type Description
bounds Rectangle The bounding rectangle that defines the ellipse.
pen PdfPen Pen that determines the stroke color, width, and style of the ellipse.
brush PdfBrush Brush that determines the fill color and texture of the ellipse.

Returns void

drawImage

Draws an image on the page graphics.

// Load an existing PDF document
let document: PdfDocument = new PdfDocument(data, password);
// Access the first page
let page: PdfPage = document.getPage(0);
// Gets the graphics of the PDF page
let graphics: PdfGraphics = page.graphics;
// Create a new image object using JPEG image data as a Base64 string
let image: PdfImage = new PdfBitmap('/9j/4AAQSkZJRgABAQEAkACQAAD/4....QB//Z');
// Draw the image on the page graphics
graphics.drawImage(image, {x: 10, y: 20});
// Save the document
document.save('output.pdf');
// Destroy the document
document.destroy();
Parameter Type Description
image PdfImage The image to be drawn on the page.