GcDocs PDF Viewer allows you to add graphical signatures in PDF documents by using Signature tool in Annotation Editor.
The 'Signature Tool' button opens the 'Add Signature' dialog which lets you type, draw or add the image of a signature in a PDF document. You can also format the signatures by using formatting options while typing or drawing signatures. If location of the signature is not specified, you can move the digital signature to a desired location with the help of a mouse.
The below GIF demonstrates how to draw, format and add signatures in a PDF document. As can be observed, the signature is added as a Stamp Annotation in the Annotation Editor's property panel. These properties can be used to remove or download signatures, make them printable, change their position, height or width etc.
The below image displays typed signatures with various formatting options available in the 'Add Signature' dialog like font, color, size etc.
The below image displays an uploaded image of signature which can be added into a PDF docment.
Note: SupportApi should be configured in order to use Signature Tool, as the editing operation is performed in a PDF document.
Add Signature Tool Button in Viewer Toolbar
The Annotation Editor toolbar contains 'Signature tool' button by default. However, you can also add the button to viewer's toolbar layout by using below code:
| Index.cshtml |
Copy Code
|
|---|---|
viewer.toolbarLayout.viewer.default.splice(1, 0, 'edit-sign-tool'); viewer.applyToolbarLayout(); |
|
Save Signature
You can save signatures by checking the 'Save Signature' checkbox which saves the signature data into browser's local storage for later use.
Customize Signature Tool Dialog
The appearance and behavior of 'Add Signature' dialog can be customized by using the signTool option as shown in the below code:
| Index.cshtml |
Copy Code
|
|---|---|
viewer.options.signTool = {
title: 'Please, sign.',
selectedTab: 'Draw',
hideTabs: true, hideToolbar: true, hideSaveSignature: true,
saveSignature: false,
penColor: 'black', penWidth: 2,
location: 'Center',
destinationScale: 1.2
};
|
|
Note: The showSignTool method takes precedence over the signTool option if the settings object is passed as its argument.
For more information, refer Graphical Signature in GcDocs PDF Viewer demos.