1WebViewer(...)
2.then(instance => {
3 const { annotationManager, Annotations } = instance.Core;
4
5 // myBtn is your own custom button
6 document.getElementById('myBtn').addEventListener('click', () => {
7
8 // set flags for required and edit
9 const flags = new Annotations.WidgetFlags();
10 flags.set('Required', true);
11 flags.set('Edit', true);
12
13 // set font type
14 const font = new Annotations.Font({ name: 'Helvetica' });
15
16 // create a form field
17 const field = new Annotations.Forms.Field("some checkbox field name", {
18 type: 'Btn',
19 value: 'Off',
20 flags,
21 font: font,
22 });
23
24 // create a widget annotation
25 // caption options are:
26 // "4" = Tick
27 // "l" = Circle
28 // "8" = Cross
29 // "u" = Diamond
30 // "n" = Square
31 // "H" = Star
32 // "" = Check
33 const widgetAnnot = new Annotations.CheckButtonWidgetAnnotation(field, {
34 appearance: 'Off',
35 appearances: {
36 Off: {},
37 Yes: {},
38 },
39 captions: {
40 Normal: "" // Check
41 }
42 });
43
44 // set position and size
45 widgetAnnot.PageNumber = 1;
46 widgetAnnot.X = 100;
47 widgetAnnot.Y = 100;
48 widgetAnnot.Width = 50;
49 widgetAnnot.Height = 20;
50
51 //add the form field and widget annotation
52 annotationManager.getFieldManager().addField(field);
53 annotationManager.addAnnotation(widgetAnnot);
54 annotationManager.drawAnnotationsFromList([widgetAnnot]);
55 });
56});