DsPdfViewer allows you to align annotations and form fields with each other. The snap alignment feature, which is enabled by default, can be used to align fields to the left, top, right, center or bottom edge.
For example, consider a PDF document containing an annotation or a form field and a new one is also added. While moving or resizing the new field, a dashed line will appear when it approaches the existing field's edge or center point. It indicates the alignment of new field with respect to existing field.
Apart from aligning the fields, DsPdfViewer allows you to define margins by using snap margin feature. These margins are the extra spaces before or after the edge of a field or page. The default margin between two elements or page edges is 10 points.
You can also fine tune the location and size of fields annotation and form fields by using keyboard shortcuts:
You can disable or customize snap alignment feature by using snapAlignment option in API.
The full specification for snapAlignment option is:
Index.cshtml |
Copy Code
|
---|---|
snapAlignment: true | false | { tolerance: number | { horizontal: number | false, vertical: number | false }, margin: false | true | number | { horizontal: number | boolean, vertical: number | boolean }, center: false | true | { horizontal: boolean, vertical: boolean }, } |
The description of above settings:
By default, snap tolerance is 5 points, snap margin is 10 points, snap to center is true.
The tolerance value of snap alignment feature can be set by using below code:Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: { tolerance: 25 }, supportApi: 'api/pdf-viewer' }); |
Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: { tolerance: { vertical: 10, horizontal: 50 } }, supportApi: 'api/pdf-viewer' }); |
Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: { center: false }, supportApi: 'api/pdf-viewer' }); |
Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: { center: { vertical: true, horizontal: false, } }, supportApi: 'api/pdf-viewer' }); |
Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: false, supportApi: 'api/pdf-viewer' }); |
Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: { margin: { vertical: 50, horizontal: false }, supportApi: 'api/pdf-viewer' } }); |
Index.cshtml |
Copy Code
|
---|---|
var viewer = new DsPdfViewer("#root", { snapAlignment: { tolerance: { horizontal: false } }, supportApi: 'api/pdf-viewer' }); |