SignatureComponent
12 Sep 20254 minutes to read
Represents the EJ2 Angular Signature Component.
<canvas ejs-signature />Properties
backgroundColor string
Gets or sets the background color of the component.
The background color of the component that accepts hex value, rgb and text (like ‘red’). The default value is ‘’.
Defaults to ’’
backgroundImage string
Gets or sets the background image for the component.
An image that used to fill the background of the component. The default value is ‘’.
Defaults to ’’
disabled boolean
Gets or sets whether to disable the signature component where the opacity is set to show disabled state.
True, if the signature component is disabled for user interaction. The default value is false.
Defaults to false
enablePersistence boolean
Gets or sets whether to persist component’s state between page reloads.
True, if the component’s state persistence is enabled. The default value is false.
Component’s property will be stored in browser local storage to persist component’s state when page reloads.
Defaults to false
isReadOnly boolean
Gets or sets whether to prevent the interaction in signature component.
True, if the signature component is read only state where the user interaction is prevented. The default value is false.
Defaults to false
maxStrokeWidth number
Gets or sets the maximum stroke width for signature.
The signature component calculates stroke width based on Velocity, MinStrokeWidth and MaxStrokeWidth.
The maximum width of stroke. The default value is 2.0.
Defaults to 2
minStrokeWidth number
Gets or sets the minimum stroke width for signature.
The signature component calculates stroke width based on Velocity, MinStrokeWidth and MaxStrokeWidth.
The minimum width of stroke. The default value is 0.5.
Defaults to 0.5
saveWithBackground boolean
Gets or sets whether to save the signature along with Background Color and background Image while saving.
True, if signature component to save with background. The default value is true.
Defaults to true
signatureValue string
Gets or sets the last signature url to maintain the persist state.
strokeColor string
Gets or sets the stroke color of the signature.
The color of the signature stroke that accepts hex value, rgb and text (like ‘red’). The default value is “#000000”.
Defaults to ‘#000000’
velocity number
Gets or sets the velocity to calculate the stroke thickness based on the pressure of the contact on the digitizer surface.
The Signature component calculates stroke thickness based on Velocity, MinStrokeWidth and MaxStrokeWidth.
The default value is 0.7.
Defaults to 0.7
Methods
canRedo
To check whether the redo collection is empty or not.
Returns boolean
canUndo
To check whether the undo collection is empty or not.
Returns boolean
clear
Erases all the signature strokes signed by user.
Returns void
destroy
Removes the component from the DOM and detaches all its related event handlers.
Also it maintains the initial input element from the DOM.
Returns void
draw
To draw the signature based on the given text, with the font family and font size.
Returns void
getBlob
To get the signature as Blob.
| Parameter | Type | Description |
|---|---|---|
| url | string |
specify the url/base 64 string to get blob of the signature. |
Returns Blob
getSignature
Gets the signature as a Base 64 string.
This method is used to retrieve the current signature on the canvas as a Base 64-encoded string, in the specified image format.
Returns string
isEmpty
To check whether the signature is empty or not.
Returns boolean
load
To load the signature with the given base 64 string, height and width.
| Parameter | Type | Description |
|---|---|---|
| signature | string |
specify the url/base 64 string to be drawn as signature. |
| width (optional) | number |
specify the width of the loaded signature image. |
| height (optional) | number |
specify the height of the loaded signature image. |
Returns void
redo
Redo the last user action.
Returns void
refresh
To refresh the signature.
Returns void
save
To save the signature with the given file type and file name.
| Parameter | Type | Description |
|---|---|---|
| type (optional) | SignatureFileType |
specify type of the file to be saved a signature. |
| fileName (optional) | string |
specify name of the file to be saved a signature. |
Returns void
saveAsBlob
To save the signature as Blob.
Returns Blob
undo
Undo the last user action.
Returns void
Events
beforeSave EmitType<SignatureBeforeSaveEventArgs>
Gets or sets an event callback that is raised while saving the signature.
The file name and the file type can be changed using SignatureBeforeSaveEventArgs and SignatureFileType.
The event callback is raised only for the keyboard action (Ctrl + S).
change EmitType<SignatureChangeEventArgs>
Gets or sets an event callback that is raised for the actions like undo, redo, clear and while user complete signing on signature component.
created EmitType<Event>
Triggers once the component rendering is completed.