オプション
すべて
  • Public
  • Public/Protected
  • すべて
メニュー

ViewerOptions クラス

PDFビューワオプションのクラス。

階層

  • ViewerOptions

インデックス

プロパティ

オプション baseUrl

baseUrl: undefined | string = ""

フォームの送信およびテーマのURLに使用されます。

サンプル
var viewer = new GcPdfViewer("#root", { baseUrl: "http://localhost/mysite/" });

オプション cMapPacked

cMapPacked: undefined | false | true

ビューワが拡張子「.bin」のCMapファイルの圧縮バージョンを検索する必要があるかどうかを示します。

既定値

true

サンプル
var viewer = new GcPdfViewer("#root", { cMapPacked: false } );

オプション cMapUrl

cMapUrl: undefined | string

外部フォントのCMapテーブルが保存されるフォルダへのURI。

既定値

「resources/bcmaps/」

サンプル
var viewer = new GcPdfViewer("#root", { cMapUrl: "../data/cmaps/" } );

オプション coordinatesOrigin

coordinatesOrigin: "TopLeft" | "BottomLeft" = "TopLeft"

PDFページの原点座標。このオプションは、注釈エディタおよびフォームエディタのプロパティパネルに使用されます。

既定値

TopLeft

サンプル
// 座標の原点を左下の点に変更します。 
var viewer = new GcPdfViewer("#root", { coordinatesOrigin: "BottomLeft" } );

coordinatesPrecision

coordinatesPrecision: number

注釈座標の丸め精度。注釈およびフォームエディタによって使用されます。

既定値

1

サンプル
// デフォルトの丸め精度を0.001に変更します。 
var viewer = new GcPdfViewer("#root", { coordinatesPrecision: 0.001 } );

オプションの customIcons

customIcons: undefined | {}

このオプションを使用して、デフォルトの SVG アイコンをカスタム アイコンに変更します。 利用可能なアイコン キー: 'undo2', 'font-bold', 'font-italic', 'checkbox-checked', 'checkbox-unchecked', 'close', 'aspect-ratio', 'search', 'chevron', 'chevron-accent', 'animated-spinner', 'drag-handle', 'download', 'keyboard', 'brush', 'image', 'image-list', 'save', 'theme-change', 'single-page', 'continuous-view', 'view-mode', 'show-view-tools', 'show-edit-tools', 'show-form-editor', 'toggle-annotation-properties', 'toggle-form-properties', 'edit-converted-to-content', 'edit-free-text', 'edit-ink', 'edit-text', 'edit-square', 'edit-line', 'edit-link', 'edit-circle', 'edit-stamp', 'add-stamp-accent', 'edit-sign-tool', 'edit-file-attachment', 'edit-sound', 'edit-polyline', 'edit-polygon', 'edit-popup', 'edit-redact', 'edit-redact-apply', 'edit-redact-applied', 'edit-unknown-type', 'edit-widget-signature', 'edit-widget-tx-field', 'edit-widget-tx-text-area', 'edit-widget-tx-comb', 'edit-widget-tx-password', 'edit-widget-btn-checkbox', 'edit-widget-btn-radio', 'edit-widget-btn-push', 'edit-widget-btn-submit', 'edit-widget-btn-reset', 'edit-widget-ch-combo', 'edit-widget-ch-list-box', 'edit-widget-unknown-type', 'edit-undo', 'edit-redo', 'remove-attachment', 'edit-select', 'edit-erase', 'form-filler', 'field-invalid', 'new-document', 'new-page', 'delete-page', 'print', 'rotate', 'confirm-ok', 'confirm-cancel', 'open', 'open-pdf', 'text-selection', 'hide-annotations', 'pan', 'bookmarks', 'structure-tree', 'layers', 'thumbnails', 'articles', 'attachments', 'documents-list', 'share', 'shared-documents-list', 'view-mode-on', 'view-mode-off', 'edit-mode-on', 'edit-mode-off', 'remove-user', 'doc-properties', 'about', 'pdf-doc-title', 'close-icon-sm', 'menu-dots', 'comments-status-accepted', 'comments-status-cancelled', 'comments-status-completed', 'comments-status-rejected', 'context-copy', 'context-paste', 'context-cut', 'context-delete', 'move-to-top-page', 'move-to-bottom-page', 'arrow-expand-horizontal', 'arrow-expand-all', 'magnify-minus-outline', 'magnify-plus-outline', 'magnify', 'text-tools', 'draw-tools', 'attachment-tools', 'form-tools', 'page-tools', 'resize-handle-h'.

サンプル
var viewer = new GcPdfViewer(selector, { customIcons: { 'open': '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M9.516 14.016q1.875 0 3.188-1.313t1.313-3.188-1.313-3.188-3.188-1.313-3.188 1.313-1.313 3.188 1.313 3.188 3.188 1.313zM15.516 14.016l4.969 4.969-1.5 1.5-4.969-4.969v-0.797l-0.281-0.281q-1.781 1.547-4.219 1.547-2.719 0-4.617-1.875t-1.898-4.594 1.898-4.617 4.617-1.898 4.594 1.898 1.875 4.617q0 0.984-0.469 2.227t-1.078 1.992l0.281 0.281h0.797z"></path></svg>', 'search': '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M9.516 14.016q1.875 0 3.188-1.313t1.313-3.188-1.313-3.188-3.188-1.313-3.188 1.313-1.313 3.188 1.313 3.188 3.188 1.313zM15.516 14.016l4.969 4.969-1.5 1.5-4.969-4.969v-0.797l-0.281-0.281q-1.781 1.547-4.219 1.547-2.719 0-4.617-1.875t-1.898-4.594 1.898-4.617 4.617-1.898 4.594 1.898 1.875 4.617q0 0.984-0.469 2.227t-1.078 1.992l0.281 0.281h0.797z"></path></svg>' } });

オプションの disableFeatures

disableFeatures: ViewerFeatureName[]

会社のセキュリティ ポリシーに応じて、disableFeatures オプションを使用して GcPdfViewer の特定の機能を無効にします。 disableFeatures オプションは、GcPdfViewer の初期化中にのみ指定できることに注意してください。

サンプル
// ドラッグ アンド ドロップ操作、JavaScript アクション、ファイルとサウンドの添付ファイルを無効にします。 var viewer = new GcPdfViewer("#root", { disableFeatures: ['DragAndDrop', 'JavaScript', 'AllAttachments'] } );
サンプル
// GcPdf ビューワのドラッグ アンド ドロップを無効にします。 var viewer = new GcPdfViewer(selector, { disableFeatures: ['DragAndDrop'] });

オプション disablePageLabels

disablePageLabels: undefined | false | true = false

ページラベルを無効にする場合、このオプションをtrueに設定します。

サンプル
var viewer = new GcPdfViewer("#root", { disablePageLabels: true } );

documentListUrl

documentListUrl: string = "/documents"

DocumentListPanelによって使用されるドキュメントリストサービスへのURL(addDocumentListPanelメソッドを参照します)。サービスは、利用可能なドキュメント配列を含むJSON文字列を返す必要があります(例:["pdf1.pdf"、 "pdf2.pdf"])。

既定値

「/documents」

サンプル
// 外部サービスからドキュメントリストをロードします。 
var viewer = new GcPdfViewer("#root", { documentListUrl: "documents.json" } );
サンプル
// DATA URIを使用してドキュメントリストをロードします。 
var viewer = new GcPdfViewer("#root", { documentListUrl: 'data:,[{"path": "doc1.pdf"}, {"path": "doc2.pdf", "name": "Hello doc 2", "title": "title 2"}]' } );

オプション enableXfa

enableXfa: undefined | false | true = true

動的XFAフォームがある場合は描画します。

既定値

デフォルト値Trueです。

サンプル
// XFAフォームの描画をオフにします。 
var viewer = new GcPdfViewer(selector, { enableXfa: false });

オプション externalLinkTarget

externalLinkTarget: "blank" | "self" | "parent" | "top" | "none"

externalLinkTargetオプションは、リンク注釈のターゲット属性の値を設定します。リンクされたドキュメントを開く場所を指定します。設定できる値は、「blank」、「self」、「parent」、「top」および「none」。

既定値

「none」

サンプル
var viewer = new GcPdfViewer("#root", { externalLinkTarget: "blank" } );

オプション file

file: string | any = ""

ビューワにロードするPDFファイル名、URL、またはバイナリデータを指定します。

サンプル
var viewer = new GcPdfViewer("#root", { file: 'GcPdf.pdf' } );

オプション formFiller

formFiller: FormFillerSettings

フォームフィラーの設定。

サンプル
var formFiller = { 
   mapping: { 
       'UserNameField1': { 
           title: 'User Name', 
           displayname: 'username', 
           placeholder: 'Enter here...', 
           validateoninput: true, 
           validator: function(fieldValue, field) { 
               if(fieldValue.length >= 3) 
                   return true; 
               else 
                   return 'username must be at least 3 characters'; 
           } 
       }, 
       'fld2': { hidden: true }, 
       'Country Combo Box': { 
           displayname: 'Country', 
           required: true 
        }, 
       'fld3': { displayName: 'First name!', 
           title: 'Please enter your first name.', 
           rowCustomCSS: 'given-name-row' 
        } 
   } 
}; 
var viewer = new GcPdfViewer('#root', { formFiller: formFiller }); viewer.addDefaultPanels();
サンプル
var viewer = new GcPdfViewer(selector, { 
     renderInteractiveForms: true, 
     formFiller: { 
         validator: function(val) {return (val ? null : 'フィールドを空にすることはできません。'); } 
     } 
});

オプション friendlyFileName

friendlyFileName: undefined | string = ""

ファイル名が利用できない場合に使用されます。

サンプル
viewer.options.friendlyFileName = "myFileName.pdf"; 
viewer.applyOptions();

hideAnnotationPopups

hideAnnotationPopups: true | false

注釈ポップアップを非表示にするには、このオプションをtrueに設定します。

サンプル
var viewer = new GcPdfViewer("#root", { hideAnnotationPopups: true );

オプション hideAnnotationTypes

hide注釈タイプ: ("Text" | "Link" | "FreeText" | "Line" | "Square" | "Circle" | "Polygon" | "Highlight" | "Underline" | "Squiggly" | "StrikeOut" | "Stamp" | "Ink" | "Popup" | "FileAttachment" | "Sound" | "Redact" | "Signature" | "ThreadBead" | "RadioButton" | "Checkbox" | "PushButton" | "Choice" | "TextWidget" | "Polyline")[] | "All" | "None" = ['Text', 'FreeText', 'Line', 'Square', 'Circle', 'Polygon', 'Polyline', 'Ink', 'Popup','Sound', 'Polygon', 'RadioButton', 'Checkbox', 'PushButton', 'Choice', 'TextWidget', 'Redact', 'FileAttachment', 'Signature', 'Stamp', 'Highlight', 'Underline', 'Squiggly', 'StrikeOut']

Specifies annotation types which will be hidden when 'hide-annotations' button is checked. Possible values are: ['Text', 'Link', 'FreeText', 'Line', 'Square', 'Circle', 'Polygon', 'Polyline', 'Ink', 'Popup', 'FileAttachment', 'Sound', 'ThreadBead', 'RadioButton', 'Checkbox', 'PushButton', 'Choice', 'TextWidget', 'Redact', 'Stamp', 'Highlight', 'Underline', 'Squiggly', 'StrikeOut'] or 'All' or 'None'

既定値

['Text', 'FreeText', 'Line', 'Square', 'Circle', 'Polygon', 'Polyline', 'Ink', 'Popup', 'Sound', 'Polygon', 'RadioButton', 'Checkbox', 'PushButton', 'Choice', 'TextWidget', 'Redact', 'Stamp', 'Highlight', 'Underline', 'Squiggly', 'StrikeOut'];

サンプル
// 可能なすべての注釈を非表示にします。 
let options = { hideAnnotationTypes: 'All' };
サンプル
// プッシュボタンと改訂注釈のみを非表示にします。 
let options = { hideAnnotationTypes: ['PushButton', 'Redact'] };

keepFileData

keepFileData: boolean = false

ドキュメントを有効なPDFドキュメントとして解析できないでも、fileDataプロパティを使用する場合は、このオプションをtrueに設定します。

サンプル
// 次の例では、エラーが発生したときに無効なファイルデータを表示する方法を示します。 
var viewer = new GcPdfViewer('#root', { keepFileData: true }); 
viewer.onError.register(function(eventArgs) { 
  var message = eventArgs.message; 
  if (message.indexOf("無効なPDF構造") !== -1) { 
    console.log('PDFドキュメントが壊れているため、PDFドキュメントを読み込めません。'); 
    console.log("File data:"); 
    // ファイルデータをコンソールに出力します。 
    console.log(viewer.fileData); } 
  else { 
    console.log('予期しないエラー: ' + message); 
  } 
}); 
viewer.open('sample.pdf');

オプション language

language: "en" | string

ユーザーインターフェイス言語。メモ:言語オプションを使用するには、ビューワの初期化フで言語オプションの値を指定する必要があります。

サンプル
// UI言語を日本語に設定します。 
var viewer = new GcPdfViewer(selector, { language: 'ja' }); 
viewer.addDefaultPanels();
サンプル
function loadPdfViewer(selector) { 
  // カスタム翻訳を定義します。 
  var myTranslations = { 
        "toolbar": { 
            "open-document": "Open MY document", 
            "pan": "My Pan tool", 
        } 
   }; 
   // 翻訳を初期化します。 
   GcPdfViewer.i18n.init({ 
     resources: { myLang: { translation: myTranslations } } 
   }).then(function(t) { 
     // 新しい翻訳が初期化されます。 
     // PDFビューワを作成します。 
     var viewer = new GcPdfViewer(selector, { language: 'myLang' });
     viewer.addDefaultPanels(); 
     //viewer.open("sample.pdf"); 
   }); 
} 
loadPdfViewer('#root');

lockOpenTimeout

lockOpenTimeout: number

オープンタイムアウト期間をミリ秒単位でロックします。 ユーザーは、lockOpenTimeoutオプションで指定された期間中、または前のドキュメントがロードされるまで、「open」メソッドを使用して別のドキュメントを開くことはできません。

既定値

20000

サンプル
// オープンタイムアウトを5秒に変更します。 
var viewer = new GcPdfViewer("#root", { lockOpenTimeout: 5000 ); 
viewer.open("doc1.pdf"); 
// 次にopenメソッドが呼び出されると、ビューワは 
// 前のドキュメントが開くまで最大5秒を待ちます。 
viewer.open("doc2.pdf");

オプション logLevel

logLevel: LogLevel

Signalrクライアントを使用した永続的な接続に使用されるログレベル。メモ:SignalrクライアントのASP.NETバージョンは、「トレース」ログレベルのみをサポートします。

オプション maxCanvasPixels

maxCanvasPixels: undefined | number

サポートされているキャンバスの最大サイズ(ピクセル単位)、つまり幅*高さ。キャンバスのスケーリングがmaxCanvasPixelsオプションを超えると、ページをキャンバスに再描画する代わりに、CSSスケーリングが使用されます。

既定値

パソコンまたはMacのデフォルト値は「4096 * 4096 = 16777216(16メガピクセル)」です。 iOSまたはAndroidのデフォルト値は「2560x 2048 = 5242880(5メガピクセル)」です。

オプション onBeforeCloseContextMenu

onBeforeCloseContextMenu: Function

この関数は、コンテキストメニューが非表示になりそうなときに呼び出されます。コンテキストメニューアクションを閉じないようにする場合は、falseを返します。

既定値

undefined

サンプル
viewer.options.onBeforeCloseContextMenu = function(e) { 
  console.log("コンテキストメニューはまもなく終了します。"); 
  return true; 
};
既定値

undefined

サンプル
viewer.options.onBeforeCloseContextMenu = function(e) { 
  if(!confirm("コンテキストメニューを閉じますか?")) { 
      console.log("コンテキストメニューは閉じられません。"); 
      return false; 
  } 
  console.log("コンテキストメニューが閉じられます。"); 
  return true; 
};

オプション onBeforeOpenContextMenu

onBeforeOpenContextMenu: Function

この関数は、コンテキストメニューが表示になりそうなときに呼び出されます。この関数を使用して、コンテキストメニューをカスタマイズできます。コンテキストメニューアクションを開かないようにする場合は、falseを返します。

既定値

undefined

サンプル
// 次のサンプルは、GoogleとBingの検索エンジンを使用して 
// コンテキストメニューを変更し、検索を追加する方法を示します。 
viewer.options.onBeforeOpenContextMenu = function (items, mousePosition, viewer) { 
 var selectedText = viewer.getSelectedText(); 
 if (selectedText) { 
   // 既存の項目を削除します。  
   items.splice(0, items.length); 
   // カスタムメニュー項目を追加します。 
   items.push({ 
      type: 'button', 
      text: 'Googleで検索', 
      onClick: function () { 
            window.open('http://www.google.com/search?q=' + encodeURI(selectedText), '_blank'); 
      } 
   }); 
   items.push({ 
      type: 'button', 
      text: 'Bingで検索', 
      onClick: function () { 
          window.open('https://www.bing.com/search?q=' + encodeURI(selectedText), '_blank'); 
     } 
   }); 
  } 
  return true; 
};

オプション onInitialized

onInitialized: undefined | ((viewer: any) =>void)

onInitializedハンドラーは、ビューワがインスタンス化された直後に呼び出されます。

サンプル
var viewer = new GcPdfViewer("#root", { 
  onInitialized: (viewer)=> { 
     // ビューワの初期化コードを配置します。 
  } 
});

オプション openParameters

openParameters: OpenParameters

「open」メソッドによって使用されるパラメータオブジェクト。

サンプル
// Basic認証のヘッダーを含めます。 
var viewer = new GcPdfViewer('#root', { 
  openParameters: { 
    headers: { 
       "Authorization": "Basic " + btoa(unescape(encodeURIComponent("USERNAME:PASSWORD"))), 
       "CustomHeader": "Custom header value" 
    } 
  } 
});

password

password: string = ""

保護されたPDFドキュメントの事前定義されたパスワード。

サンプル
viewer.options.password = "abc123"; 
viewer.open("protected.pdf");

renderInteractiveForms

renderInteractiveForms: boolean = true

対話式のフォーム要素を描画します。

サンプル
// 対話式のフォームを描画しません。 
var viewer = new GcPdfViewer("#root", { renderInteractiveForms: false } );

renderer

renderer: "canvas" | "svg" = "canvas"

PDFドキュメントのレンダラーの種類をcanvasまたはsvgとして指定します。

サンプル
var viewer = new GcPdfViewer("#root", { renderer: "svg" } );

オプション replyTool

返信ツールの設定。

既定値

デフォルト設定は次のとおりです。

  • readOnly: false,
  • allowAddNote: true,
  • allowChangeUserName: true,
  • allowAddReply: true,
  • allowDelete: true,
  • allowStatus: true,
  • allowChangeOtherUser: true,
  • allowDeleteOtherUser: true,
  • allowStatusOtherUser: true,
  • allowAddReplyOtherUser: true
    // 別のユーザーのコメントを変更または削除しないようにします。 
    var viewer = new GcPdfViewer('#root', { replyTool: { allowChangeOtherUser: false, 
                                                        allowDeleteOtherUser: false }, 
                                          userName: 'John', supportApi: 'api/pdf-viewer' }); 
    viewer.addReplyTool('expanded');
サンプル
// 作成者名の変更を禁止し(allowChangeUserNameはfalse)、 
// 別のユーザーのコメントの変更を禁止します(allowChangeOtherUserはfalse)。 
var viewer = new GcPdfViewer('#root', { replyTool: { allowChangeOtherUser: false, 
                                        allowChangeUserName: false }, 
                                        userName: 'John', supportApi: 'api/pdf-viewer' }); viewer.addReplyTool('expanded');
サンプル
// 読み取り専用の返信ツールを追加します。 
var viewer = new GcPdfViewer('#root', { 
   replyTool: { readOnly: true }, 
   userName: 'John', 
   supportApi: 'api/pdf-viewer' }); 
viewer.addReplyTool('expanded');
サンプル
// コンテキストメニューから[付箋の追加]項目を非表示にします。 
var viewer = new GcPdfViewer('#root', { replyTool: { allowAddNote: false }, 
                                        userName: 'John', supportApi: 'api/pdf-viewer' }); 
viewer.addReplyTool();

オプション requireTheme

requireTheme: "light" | "dark" | "viewer" | "light-blue" | "themes/dark-yellow" | "gc-blue" | null

requireThemeオプションを使用して、組み込みのCSSテーマを適用します。このオプションは、テーマのスタイルをページのヘッドに直接適用します。メモ:組み込みのテーマのみを指定でき、それ以外の場合、ビューワが失敗します。利用可能な組み込みのテーマは次のとおりです。「viewer」、「dark」、「dark-yellow」、「gc-blue」、「light」 および「light-blue」です。このオプションは、カスタムテーマを指定するために使用できる「theme」オプションよりも優先されます。

サンプル
var viewer = new GcPdfViewer(selector, { 
  requireTheme: "light" 
});

オプション secondToolbar

secondToolbar: undefined | { render?: undefined | ((toolbarKey: string) =>any[] | null) }

2番目のツールバーのオプション。

サンプル
// 「custom-toolbar-key」キーを使用してカスタムの2番目のツールバーを作成します。 
var React = viewer.getType("React"); 
var toolbarControls =[React.createElement("label", null, "Custom toolbar"), 
React.createElement("button", { onClick: () => { alert("Execute action."); }, title: "Action title" }, "Action")]; 
// 「custom-toolbar-key」キーのカスタム2番目のツールバーを登録します。 
viewer.options.secondToolbar = { 
  render: function(toolbarKey) { 
    if(toolbarKey === "custom-toolbar-key") 
      return toolbarControls; 
    return null; 
  } 
}; 
// カスタムの2番目のツールバーを表示します。 
viewer.showSecondToolbar("custom-toolbar-key");

オプション sharing

sharing: undefined | { disallowUnknownUsers?: undefined | false | true; knownUserNames?: string[]; presenceColors?: undefined | {}; presenceMode: "on" | "others" | "off" | true | false }

ドキュメントの共有設定。[共有]ダイアログボックスまたは[共有ドキュメント]パネルを使用して、ドキュメントが共有モードで開かれている場合にのみ使用されます。

サンプル
// サーバーに不明なユーザー名を禁止します。 
var viewer = new GcPdfViewer("#root", { sharing: { disallowUnknownUsers: true }, supportApi: "api/pdf-viewer" } );
サンプル
// 既知のユーザー名を指定し、他のユーザー名を禁止します。 
var viewer = new GcPdfViewer("#root", { 
     sharing: { 
         knownUserNames: ["Jaime Smith", "Jane Smith"], 
         disallowUnknownUsers: true, 
     }, 
     supportApi: "api/pdf-viewer」 
});

オプション signTool

署名ツールの設定。

@example 
```javascript 
var viewer = new GcPdfViewer(selector, { 
     signTool: { 
         title: 'Sign document', 
         penColor: '#ff0000', 
         penWidth: 5 
     } 
});

snapAlignment

snapAlignment: true | false | { center: false | true | { horizontal: boolean; vertical: boolean }; margin: false | true | number | { horizontal: number | boolean; vertical: number | boolean }; tolerance: number | { horizontal: number | false; vertical: number | false } }

位置合わせ機能を使用して設定をカスタマイズできます。tolerance は、移動またはサイズ変更されているオブジェクトとスナップされる他のオブジェクトの端の間の距離です。余白は、フィールドまたはページの端の前後の余分な間隔です。marginは、移動またはサイズ変更されているオブジェクトの端からスナップされるターゲットオブジェクトまでの距離です。centerは,オブジェクトを他のオブジェクトの中心にスナップします。

既定値
{ snapAlignment: true } 
デフォルトでは、スナップのtoleranceは 5 です。 
オブジェクトとページの端の間のmarginは 10 です。 
center はtrueです。
サンプル
// 垂直方向の余白にスナップを有効します。 
var viewer = new GcPdfViewer("#root", { snapAlignment: { margin: { vertical: 10, horizontal: false} }, supportApi: 'api/pdf-viewer'});
サンプル
// 公差とスナップマージンの変更します。 
viewer.options.snapAlignment = { tolerance: 5, margin: 20 };

stamp

stamp: { dpi?: undefined | number; selectedImageUrl?: undefined | string; stampCategories?: StampCategory[] | boolean }

スタンプオプションを使用して、スタンプボタンの設定を構成します。

既定値

undefined

サンプル
// 定義済みスタンプのカスタムセットを指定します。 
var viewer = new GcPdfViewer("#root", { 
  stamp: { 
    stampCategories: [
           { name: 'Nature', stampImageUrls: ['http://localhost:8080/150/160/nature.png', 'http://localhost:8080/250/140/nature.png', 'http://localhost:8080/250/150/nature.png'] },            { name: 'Nature 2', stampImageUrls: ['http://localhost:8080/170/150/nature.png', 'http://localhost:8080/210/130/nature.png', 'http://localhost:8080/250/120/nature.png'] }
    ]
  }
});
サンプル
// 定義済みスタンプのドロップダウンを無効にします。 
var viewer = new GcPdfViewer("#root", { 
  stamp: { 
    stampCategories: false 
  } 
});

型宣言

  • オプション dpi?: undefined | number

    オプション。DPIが指定されていないスタンプ画像のデフォルトの画像解像度(DPI)。

  • Optional selectedImageUrl?: undefined | string

    オプション。選択した画像の URL。

  • オプション stampCategories?: StampCategory[] | boolean

    スタンプのカテゴリ。

オプション supportApi

supportApi: string | SupportApiSettings

PDF編集機能を有効するに使用される外部WebAPIサービスへのURL。

サンプル
var viewer = new GcPdfViewer('#root', { supportApi: 'api/pdf-viewer' } );
サンプル

永続的な接続用のデバッグログをオンにします。

var viewer = new GcPdfViewer('#root', { supportApi: 'api/pdf-viewer', logLevel: 'Debug' } );

オプション textMarkupContextMenu

textMarkupContextMenu: TextMarkupContextMenuSettings | false

テキスト マークアップ コンテキスト メニューの設定。

サンプル
// テキスト マークアップのコンテキスト メニューを無効にします: var viewer = new GcPdfViewer(selector, { textMarkupContextMenu: false });

theme

theme: string | false = "themes/viewer"

テーマオプションを使用して、デフォルトのビューワテーマを変更します。組み込みのテーマのロードを無効にする場合、このオプションをfalseに設定します。これは、テーマのcss参照が既にある場合に役立ちます。

サンプル
// 濃い黄色のテーマをロードします、 
var viewer = new GcPdfViewer("#root", { theme: "dark-yellow.css", themes: ["themes/viewer", "themes/light-blue", "themes/dark-yellow"] } );
サンプル
// <link href="~/Content/light-blue.css" rel="stylesheet" /> 
// 組み込みのテーマをロードしないでください。 
var viewer = new GcPdfViewer("#root", { theme: false } );

themes

themes: string[] = ["themes/light", "themes/dark", "themes/viewer", "themes/light-blue", "themes/dark-yellow"]

ビューワの利用可能なテーマ。

サンプル
var viewer = new GcPdfViewer("#root", { themes: ["themes/viewer", "themes/light-blue", "themes/dark-yellow"] } );

useNativeContextMenu

useNativeContextMenu: boolean = false

デフォルトでは、ビューワは独自のコンテキストメニューを使用します。ブラウザのコンテキストメニューを使用する場合は、このオプションをtrueに設定します。メモ:このオプションをtrueに設定すると、コンテキストメニューの一部の機能が使用できなくななります(たとえば、エディタと返信ツールのアクション)。

既定値

false

サンプル
// ブブラウザのコンテキストメニューを有効します。 
var viewer = new GcPdfViewer("#root", { useNativeContextMenu: true } );

userData

userData: any

ビューワに関連付けられた任意のデータ。このデータは、ドキュメントが保存されるときにサーバーに送信されます。

サンプル
var viewer = new GcPdfViewer('#root', { supportApi: 'api/pdf-viewer' } ); 
viewer.options.userData = { secretNumber: 5, innerData: { innerContent: 'content' } }; 
viewer.applyOptions(); 
viewer.open('sample.pdf');

オプション userName

userName: undefined | string = ""

作成者名。このオプションは、注釈エディタと返信ツールによって[作成者]フィールドのデフォルトとして使用されます。

サンプル
var viewer = new GcPdfViewer('#root', { userName: 'John', supportApi: 'api/pdf-viewer' });

workerSrc

workerSrc: string = "gcpdfviewer.worker.js"

Web WorkerスクリプトへのURL。Web WorkerスクリプトはバックグラウンドスレッドでPDFドキュメントをロードおよ描画するに使用されます。メモ:(Web Workerスクリプトを使用せずに)メインスレッドでPDFをレンダリングすると、大きなPDFファイルをロードするときにPDFビューわのパフォーマンスが低下します。

サンプル
var viewer = new GcPdfViewer("#root", { workerSrc: "http://localhost:5000/gcpdfviewer.worker.js" } );

オプション zoomOptions

zoomOptions: undefined | { dropdownZoomFactorValues?: number[]; maxZoom?: undefined | number; minZoom?: undefined | number }

ズーム制御のオプション。

サンプル
var viewer = new GcPdfViewer("#root", { 
  zoomOptions: { 
    minZoom: 0.5, 
    maxZoom: 1.5, 
    dropdownZoomFactorValues: [0.5, 0.7, 1, 1.5] 
  } 
});

オブジェクトリテラル

allowedTools

allowedTools: object

このオプションを使用して、フォームエディタの注釈ツールまたは注釈エディタのフィールドツールを有効します。

既定値
{ annotationEditor: 'annotations', formEditor: 'fields' }
サンプル
viewer.options.allowedTools = { formEditor: 'all' };

annotationEditor

annotationEditor: "annotations" = "annotations"

formEditor

formEditor: "fields" = "fields"

オプション caret

caret: object

テキスト選択カーソルの設定。

説明
設定説明は次のとおりです。 
caretBlinkTime - ミリ秒単位でキャレットの点滅期間。
caretStopBlinkTime - ミリ秒単位でキャレットの点滅を停止期間。「0」とは、キャレットの点滅期間が停止しないと意味します。
color - キャレットの色。
width - キャレットの幅。
allowForPan - パンツールが有効の場合でも、キーによってキャレットを移動できるようにします。
サンプル
// キャレットを非表示にします。
var viewer = new GcPdfViewer("#root", { caret: false } );
サンプル
// キャレットの色と幅を変更します。 
var viewer = new GcPdfViewer("#root", { caret: {"color": "#ff0000", "width": 2} } );

allowForPan

allowForPan: false = false

caretBlinkTime

caretBlinkTime: number = 300

caretStopBlinkTime

caretStopBlinkTime: number = 5000

color

color: string = "#000000"

width

width: number = 1

editorDefaults

editorDefaults: object

新しい注釈とフィールドのデフォルト値が含まれます。

サンプル
// デフォルトの付箋とテキスト注釈の色を赤に変更します。 
var viewer = new GcPdfViewer("#root", { 
     editorDefaults: { 
       stickyNote: { color: "#ff0000" }, 
       textAnnotation: {color: "#ff0000" } 
     }, 
     supportApi: 'api/pdf-viewer' 
});
サンプル
// デフォルトの四角形注釈の外観を変更します。
var viewer = new GcPdfViewer("#root", { 
     editorDefaults: { 
       squareAnnotation: { 
          annotationType: 5, // AnnotationTypeCode.SQUARE 
          subtype: "Square", 
          borderStyle: { width: 5, style: 1, horizontalCornerRadius: 0, verticalCornerRadius: 0 }, 
          color: [0, 0, 0], 
          interiorColor: [255, 0, 0], 
        } 
     }, 
     supportApi: 'api/pdf-viewer’ 
});

checkBoxButton

checkBoxButton: object

rect

rect: number[] = [0, 0, 18, 18]

combTextField

combTextField: object

rect

rect: number[] = [0, 0, 140, 24]

comboChoice

comboChoice: object

rect

rect: number[] = [0, 0, 140, 24]

listBoxChoice

listBoxChoice: object

rect

rect: number[] = [0, 0, 140, 44]

passwordField

passwordField: object

rect

rect: number[] = [0, 0, 140, 24]

pushButton

pushButton: object

rect

rect: number[] = [0, 0, 140, 24]

radioButton

radioButton: object

rect

rect: number[] = [0, 0, 18, 18]

resetButton

resetButton: object

rect

rect: number[] = [0, 0, 140, 24]

stickyNote

stickyNote: object

color

color: string = "#38e5ff"

contents

contents: string = ""

submitButton

submitButton: object

rect

rect: number[] = [0, 0, 140, 24]

textAnnotation

textAnnotation: object

color

color: string = "#ffdc38"

contents

contents: string = ""

textArea

textArea: object

rect

rect: number[] = [0, 0, 140, 44]

textField

textField: object

rect

rect: number[] = [0, 0, 140, 24]

fieldsAppearance

fieldsAppearance: object

フォームフィールドの外観の描画設定。このオプションを使用して、フォームフィールドの外観の特定の描画タイプをカスタマイズします。 利用可能な描画タイプは次のとおりです。

  • 「Custom」:デフォルトのタイプ。 カスタムの外観には、Webの外観に比べていくつかの改善があります。
    例え 背景または境界線の色を指定できます。
  • 「Web」:プラットフォームネイティブのスタイルを使用した標準フォームフィールドの外観。詳細については、https://developer.mozilla.org/ja/docs/Web/CSS/appearanceを参照します。
  • 「Predefined」:利用可能な場合はPDFからの事前定義された外観ストリーム。外観ストリームが利用できない場合は、カスタム外観が使用されます。
サンプル
// ラジオボタンとチェックボックスボタンにプラットフォームネイティブのスタイルを使用して、標準のフォームフィールドの外観を使用します。 
var viewer = new GcPdfViewer("#root", { fieldsAppearance: { radioButton: "Web", checkBoxButton: "Web" } });
サンプル
// PDFからの事前定義された外観ストリームを使用します。 
var viewer = new GcPdfViewer("#root", { fieldsAppearance: { radioButton: "Predefined", checkBoxButton: "Predefined" } });

checkBoxButton

checkBoxButton: "Custom" = "Custom"

pushButton

pushButton: "Custom" = "Custom"

radioButton

radioButton: "Custom" = "Custom"

オプション restoreViewStateOnLoad

restoreViewStateOnLoad: object

ビューの変更を追跡し、次のページをロードする時に前の状態を復元します。trackFileの場合、バイナリデータではなく、URIを使用してドキュメントを開いたときに、開いたファイルのみを追跡します。

既定値
{ 
    trackViewMode: true, trackMouseMode: true, trackScale: true, trackSidebar: true, trackSidebarWidth: true, 
    trackPageRotation: false, trackFullScreen: false, trackTheme: false, trackFile: false, 
};
サンプル
// ビューの変更の追跡を無効します。 
var viewer = new GcPdfViewer("#root", { restoreViewStateOnLoad: false } );
サンプル
// スケール(拡大縮小)のみを追跡します。 
var viewer = new GcPdfViewer("#root", { restoreViewStateOnLoad: { trackScale: true } });

trackFile

trackFile: false = false

trackFullScreen

trackFullScreen: false = false

trackMouseMode

trackMouseMode: true = true

trackPageRotation

trackPageRotation: false = false

trackScale

trackScale: true = true

trackSidebar

trackSidebar: true = true

trackSidebarWidth

trackSidebarWidth: true = true

trackTheme

trackTheme: false = false

trackViewMode

trackViewMode: true = true

shortcuts

shortcuts: object

キーボード ショートカット。

13

13: { ctrl: boolean; keyCode: number; tool: string }[] = [{ keyCode: 13, tool: "confirm-ok", ctrl: true, }]

27

27: { keyCode: number; tool: string }[] = [{ keyCode: 27, tool: "confirm-cancel" }]

33

33: { tool: string }[] = [{tool: "scrollUp"}]

34

34: { tool: string }[] = [{tool: "scrollDown"}]

35

35: ({ ctrl: boolean; keyCode: number; shift: boolean; tool: string } | { ctrl: boolean; keyCode: number; tool: string } | { keyCode: number; shift: boolean; tool: string } | { keyCode: number; tool: string })[] = [{keyCode: 35,tool: "move_caret_document_end",shift: true,ctrl: true,}, {keyCode: 35,tool: "move_caret_document_end",ctrl: true,}, {keyCode: 35,tool: "move_caret_sequence_end",shift: true,}, {keyCode: 35,tool: "move_caret_sequence_end"}]

36

36: ({ ctrl: boolean; keyCode: number; shift: boolean; tool: string } | { ctrl: boolean; keyCode: number; tool: string } | { keyCode: number; shift: boolean; tool: string } | { keyCode: number; tool: string })[] = [{keyCode: 36,tool: "move_caret_document_start",shift: true,ctrl: true,}, {keyCode: 36,tool: "move_caret_document_start",ctrl: true,}, {keyCode: 36,tool: "move_caret_sequence_start",shift: true,}, {keyCode: 36,tool: "move_caret_sequence_start"}]

37

37: ({ keyCode: number; shift: boolean; tool: string } | { alt: boolean; keyCode: number; tool: string } | { keyCode: number; tool: string })[] = [{keyCode: 37,tool: "move_caret_left",shift: true,}, {keyCode: 37,tool: "history_back",alt: true,},{keyCode: 37,tool: "move_caret_left"}]

38

38: ({ keyCode: number; shift: boolean; tool: string } | { keyCode: number; tool: string })[] = [{keyCode: 38,tool: "move_caret_up",shift: true,},{keyCode: 38,tool: "move_caret_up"}]

39

39: ({ keyCode: number; shift: boolean; tool: string } | { alt: boolean; keyCode: number; tool: string } | { keyCode: number; tool: string })[] = [{keyCode: 39,tool: "move_caret_left",shift: true,}, {keyCode: 39,tool: "history_back",alt: true,},{keyCode: 39,tool: "move_caret_left"}]

40

40: ({ keyCode: number; shift: boolean; tool: string } | { keyCode: number; tool: string })[] = [{keyCode: 40,tool: "move_caret_down",shift: true,},{keyCode: 40,tool: "move_caret_down"}]

R

R: ({ tool: string } | { shift: boolean; tool: string })[] = [{ tool: "rotate" }, { shift: true, tool: "rotate" }]

0

0: object

ctrl

ctrl: boolean = true

tool

tool: string = "zoom_pagesize"

107

107: object

ctrl

ctrl: boolean = true

tool

tool: string = "zoomin"

109

109: object

ctrl

ctrl: boolean = true

tool

tool: string = "zoomout"

187

187: object

ctrl

ctrl: boolean = true

tool

tool: string = "zoomin"

189

189: object

ctrl

ctrl: boolean = true

tool

tool: string = "zoomout"

9

9: object

ctrl

ctrl: boolean = true

tool

tool: string = "zoom_clientsize"

A

A: object

ctrl

ctrl: boolean = true

tool

tool: string = "select_all"

F

F: object

ctrl

ctrl: boolean = true

tool

tool: string = "search"

H

H: object

tool

tool: string = "pan"

O

O: object

ctrl

ctrl: boolean = true

tool

tool: string = "open"

P

P: object

ctrl

ctrl: boolean = true

tool

tool: string = "print"

S

S: object

tool

tool: string = "selection"

useCanvasForSelection

useCanvasForSelection: object

テキスト選択とアクティブ・非アクティブな検索結果のハイライト表示の色設定。

  • selectionColor: ドキュメント内の検索結果リストから選択される検索結果を強調表示するに使用されるデフォルトの色を変更します。
  • inactiveHighlightColor: ドキュメント内のすべての検索結果を強調表示するに使用されるデフォルトの色を変更します。
  • selectionColor: ドキュメントで選択したテキストをマークするに使用されるデフォルトの色を変更します。
サンプル
var options = { 
  useCanvasForSelection: { 
    selectionColor: "rgba(0, 0, 0, 0.25)", 
    highlightColor: "rgba(255, 94, 255, 0.35)", 
    inactiveHighlightColor: "rgba(125, 30, 176, 0.35)」 
  } 
}; 
var viewer = new GcPdfViewer("#root", options ); 
viewer.addSearchPanel(); 
viewer.open("sample.pdf");

highlightColor

highlightColor: string = "rgba(255, 94, 0, 0.35)"

ドキュメント内の検索結果リストから選択される検索結果を強調表示するに使用されるデフォルトの色を変更します。

inactiveHighlightColor

inactiveHighlightColor: string = "rgba(180, 0, 170, 0.35)"

ドキュメント内のすべての検索結果を強調表示するに使用されるデフォルトの色を変更します。

selectionColor

selectionColor: string = "rgba(0, 86, 195, 0.25)"

ドキュメントで選択したテキストをマークするに使用されるデフォルトの色を変更します。

zoomByMouseWheel

zoomByMouseWheel: object

マウスホイールによってドキュメントを拡大縮小します。

サンプル
// CtrlキーまたはMetaキーを押さずに、マウスホイールによって拡大縮小を有効します。 
var viewer = new GcPdfViewer("#root", { zoomByMouseWheel: { always: true } } );

always

always: false = false

ctrlKey

ctrlKey: true = true

metaKey

metaKey: true = true