ViewerConfig – Doconut เอกสาร

ViewerConfig (namespace Doconut) อธิบายลักษณะและพฤติกรรมของตัวดูในเบราว์เซอร์. มันไม่ส่งผลต่อคุณภาพการเรนเดอร์เอกสาร; ใช้การตั้งค่ารูปแบบสำหรับเรื่องนั้น. คลาส C# และปลั๊กอินจาวาสคริปต์รุ่นเก่ามีค่าเริ่มต้นที่แตกต่างกัน, ดังนั้นให้แมปค่าอย่างชัดเจน.

คุณสมบัติ C#

ประเภท	คุณสมบัติ	ค่าเริ่มต้น	คำอธิบาย
`bool`	`ShowThumbs`	`true`	แสดงแผงภาพย่อ.
`bool`	`AutoLoad`	`false`	โหลดโดยอัตโนมัติหลังจากการเริ่มต้น. การไหลของโทเคนปกติจะเรียก `View(token)` อย่างชัดเจน.
`bool`	`AutoFocus`	`true`	ย้ายโฟกัส/การเลื่อนของเบราว์เซอร์ไปยังตัวดูระหว่างการเริ่มต้น.
`bool`	`AutoPageFocus`	`true`	ทำให้ภาพย่อปัจจุบันมองเห็นได้ขณะเปลี่ยนหน้า.
`int`	`PageZoom`	`100`	เปอร์เซ็นต์การซูมเริ่มต้น.
`int`	`ZoomStep`	`10`	เปอร์เซ็นต์ที่เพิ่มหรือหักโดยคำสั่งซูม.
`int`	`MaxZoom`	`300`	เปอร์เซ็นต์การซูมสูงสุด.
`bool`	`ShowToolTip`	`true`	แสดง tooltip ตำแหน่งหน้าในขณะเลื่อน.
`string`	`ToolTipPageText`	`"Page "`	คำนำหน้าที่ใช้ใน tooltip ของหน้า.
`bool`	`CacheEnabled`	`false`	เก็บหน้าต่างเคลื่อนที่ของภาพหน้าในหน่วยความจำของเบราว์เซอร์. ไม่ใช้ `localStorage`.
`bool`	`LargeDoc`	`false`	เพิ่มองค์ประกอบหน้าเป็นชุดตามเวลา สำหรับเอกสารขนาดใหญ่.
`bool`	`ShowHyperlinks`	`false`	เรนเดอร์การซ้อนลิงก์เมื่อการตั้งค่าเซิร์ฟเวอร์ดึงออกมา.
`bool`	`FixedZoom`	`true`	ใช้เปอร์เซ็นต์การซูมคงที่แทนการคำนวณใหม่แบบตอบสนอง.
`int`	`FixedZoomPercent`	`100`	การซูมบนเดสก์ท็อปคงที่.
`int`	`FixedZoomPercentMobile`	`75`	การซูมบนมือถือคงที่.
`string`	`BasePath`	`"/"`	ตำแหน่งที่ตัวดูส่งคำขอหน้า. `"/"` คือตัวจัดการ `DocImage.axd` ที่รากของไซต์. สำหรับแอปพลิเคชันในไดเรกทอรีเสมือน, ใช้ชื่อไดเรกทอรี โดยไม่มี `/` นำหน้า (`"myapp"` หมายถึง `/myapp/DocImage.axd`).
`string`	`ResPath`	`"doconut-res/images"`	โฟลเดอร์ที่วิดเจ็ตโหลดรูปภาพของตนเองจาก: โฟลเดอร์ `images` ภายใต้ `ResourcesPath`, โดยไม่มี `/` นำหน้า.
`string`	`FitType`	`"width"`	`"width"`, `"height"` หรือว่างสำหรับไม่มีการปรับอัตโนมัติ. `"page"` ไม่ได้รับการยอมรับโดยวิดเจ็ตปัจจุบัน.
`bool`	`RetryOn409`	`false`	ลองใหม่คำขอหน้าเมื่อได้รับคำตอบว่า "still rendering". `DocImage.axd` เรนเดอร์แบบซิงโครนัสและไม่ส่งสัญญาณนั้น; ตั้งค่าเป็น `false`.

csharp

var config = new ViewerConfig
{
    ShowThumbs = true,
    AutoLoad = false,
    PageZoom = 100,
    MaxZoom = 300,
    FitType = "width",
    BasePath = "/",                 // "/" = the DocImage.axd handler at the site root (Web.config)
    ResPath = "doconut-res/images", // the images folder under ResourcesPath, no leading '/'
    ShowHyperlinks = true
};
// Emit it with viewer.RenderViewer("viewerEl", token, config) - see the Viewer reference.

การสร้าง ViewerConfig ด้วย RenderViewer

Viewer.RenderViewer(elementId, token, config) แปลง ViewerConfig ให้เป็นสคริปต์การเริ่มต้นของวิดเจ็ต. มันเขียน หก คุณสมบัติข้างต้น — BasePath, ResPath, ShowThumbs, AutoLoad, PageZoom, และ FitType — แล้วเรียก View(token). คุณสมบัติอื่น ๆ จะไม่ถูกเขียน: สำหรับ MaxZoom, ShowHyperlinks, การตั้งค่าซูม, หรือคอลแบ็กใด ๆ, ให้เริ่มต้นวิดเจ็ตด้วยตัวเลือกจาวาสคริปต์ด้านล่างเอง. ดู Viewer สำหรับ RenderViewer.

การแมปจาก C# ไปยังจาวาสคริปต์

อย่า ส่ง ViewerConfig ที่ถูกซีเรียลไลซ์โดยตรงไปยัง docViewer(...). คีย์ส่วนใหญ่ของวิดเจ็ตใช้ camelCase, ในขณะที่คีย์ path/fit ที่กำหนดไว้สามคีย์ใช้ PascalCase.

C#	จาวาสคริปต์
`ShowThumbs`	`showThumbs`
`AutoLoad`	`autoLoad`
`AutoFocus`	`autoFocus`
`AutoPageFocus`	`autoPageFocus`
`PageZoom`	`pageZoom`
`ZoomStep`	`zoomStep`
`MaxZoom`	`maxZoom`
`ShowToolTip`	`showToolTip`
`ToolTipPageText`	`toolTipPageText`
`CacheEnabled`	`cacheEnabled`
`LargeDoc`	`largeDoc`
`ShowHyperlinks`	`showHyperlinks`
`FixedZoom`	`fixedZoom`
`FixedZoomPercent`	`fixedZoomPercent`
`FixedZoomPercentMobile`	`fixedZoomPercentMobile`
`BasePath`	`BasePath`
`ResPath`	`ResPath`
`FitType`	`FitType`
`RetryOn409`	`retryOn409`

ค่าเริ่มต้นของ JavaScript

วิดเจ็ตมีค่าเริ่มต้นเก่าที่แตกต่างจากคลาส C#. ค่าต่อไปนี้มาจากการนำไปใช้ของ docViewer.js ปัจจุบัน.

ตัวเลือก	ค่าเริ่มต้น	หมายเหตุ
`leftMinWidth` / `leftMaxWidth`	`220` / `800`	ขอบเขตความกว้างของแผงรูปย่อ.
`showThumbs`	`true`	การมองเห็นรูปย่อเริ่มต้น.
`autoFocus` / `autoPageFocus`	`true` / `false`	`autoPageFocus` แตกต่างจากค่าเริ่มต้นของ C#.
`thumbWidth` / `thumbHeight` / `thumbPadding`	`150` / `200` / `10`	รูปทรงของรูปย่อเป็นพิกเซล.
`pageZoom` / `zoomStep` / `maxZoom`	`100` / `10` / `200`	ค่า `maxZoom` ของ JavaScript แตกต่างจาก C# (`300`).
`showToolTip` / `toolTipPageText`	`true` / `"Page "`	ทูลทิปตำแหน่งหน้า.
`format` / `doc` / `AccessToken`	`""` / `0` / `""`	ค่าการเริ่มต้นภายใน; ปกติจะถูกเติมโดย `View(token)`.
`debugMode`	`false`	การวินิจฉัยเพิ่มเติมของไคลเอนต์.
`FitType`	`""`	ไม่มีการปรับอัตโนมัติหากไม่ได้ระบุ.
`BasePath`	`"DocImage.axd"`	ค่าเริ่มต้นแบบเก่า. ตั้งค่าอย่างชัดเจน: `'/'` สำหรับตัวจัดการที่รากของไซต์.
`ResPath`	`""`	ตั้งค่าอย่างชัดเจนเป็นเส้นทางของรูปภาพที่ฝังอยู่.
`cacheEnabled` / `cacheCount` / `cacheDelay`	`false` / `3` / `3`	หน้าต่างและการหน่วงเวลาการโหลดล่วงหน้าของหน้าในหน่วยความจำ.
`autoLoad`	`false`	แนะนำให้ใช้การไหลของโทเค็นอย่างชัดเจน.
`largeDoc`	`true`	แตกต่างจากค่าเริ่มต้นของ C#.
`fixedZoom`	`false`	แตกต่างจากค่าเริ่มต้นของ C#.
`fixedZoomPercent` / `fixedZoomPercentMobile`	`100` / `50`	ค่าบนมือถือแตกต่างจาก C# (`75`).
`showHyperlinks`	`true`	ต้องการการสกัดข้อมูลฝั่งเซิร์ฟเวอร์เพื่อสร้างโอเวอร์เลย์.

ตั้งค่าทั้งหมดที่สำคัญต่อพฤติกรรมแทนการพึ่งพาค่าตั้งต้นใดชุดหนึ่ง:

html

<div id="divDocViewer"><div id="div_ctlDoc"></div></div>

<script>
const objViewer = $('#div_ctlDoc').docViewer({
    showThumbs: true,
    autoLoad: false,
    autoFocus: true,
    autoPageFocus: true,
    pageZoom: 100,
    zoomStep: 10,
    maxZoom: 300,
    FitType: 'width',
    cacheEnabled: false,
    largeDoc: false,
    showHyperlinks: true,
    fixedZoom: true,
    fixedZoomPercent: 100,
    fixedZoomPercentMobile: 75,
    BasePath: '/',
    ResPath: 'doconut-res/images',
    onViewerReady: function () {},
    onError: function (message) { console.error('DocViewer:', message); }
});
</script>

คอลแบ็ก

คอลแบ็ก	อาร์กิวเมนต์	วัตถุประสงค์
`onPageLoading`	`pageNum`	กำลังเริ่มการร้องขอหน้า.
`onPageLoaded`	`pageNum`	ภาพหน้าสำเร็จการโหลด.
`onThumbnailClicked`	`pageNum`	ผู้ใช้เลือกรูปย่อ.
`onPageClicked`	`pageNum`	ผู้ใช้เลือกหน้า.
`onDoubleClick`	none	วิวเวอร์ได้รับการคลิกสองครั้ง.
`onViewerBusy`	none	วิวเวอร์เข้าสู่สถานะทำงาน.
`onViewerReady`	none	การเริ่มต้นเสร็จสมบูรณ์.
`onViewerError`	none	วิวเวอร์เข้าสู่สถานะข้อผิดพลาด.
`onError`	`message`	การดำเนินการส่งคืนข้อความข้อผิดพลาด.
`onCopy`	`data`	ข้อมูลการคัดลอกข้อความพร้อมใช้งาน.
`onAutoLoadStatus`	`pageNum`	การโหลดอัตโนมัติก้าวหน้าไปยังหน้าหนึ่ง.
`onThumbsShown`	none	แผงรูปย่อปรากฏขึ้น.
`onAnnLoaded`	none	ข้อมูลคำอธิบายโหลดแล้ว.
`onAnnSaved`	none	ข้อมูลคำอธิบายบันทึกแล้ว.
`onAnnSaveError`	none	การบันทึกคำอธิบายล้มเหลว.
`onAnnClosed`	none	ส่วนต่อประสานคำอธิบายปิดลง.

ทำให้คอลแบ็กทำงานเร็ว; ส่งข้อมูลการวัดผลแบบอะซิงโครนัสและอย่าบล็อกการเรนเดอร์หน้า.

กลุ่มเมธอดสาธารณะ

กลุ่ม	เมธอดทั่วไป
วงจรชีวิต	`View(token, accessToken?)`, `Close(server?)`, `Token()`, `Init()`, `IsLoaded()`
การนำทาง	`GotoPage(page)`, `ShowPage(page, focus?)`, `Next(next)`, `CurrentPage()`, `TotalPages()`
ซูมและการปรับขนาด	`Zoom(zoomIn)`, `CurrentZoom()`, `FitType(value)`, `Refit()`
การวางแนว	`Rotate(page, angle)`, `Flip(page, flipType)`
รูปย่อ	`HideThumbs(hide)`, `ThumbSize(size)`, `ReloadThumbs(width)`, `ScrollToThumb(thumb)`
การค้นหา	`CanSearch()`, `Search(...)`, `SearchMatchCount()`, `SearchSummary(...)`, `GotoSearchMatch(...)`
คำอธิบาย	`SaveAnnotations()`, `GetAnnotations()`, `PushAnnotations(...)`, `CloseAnnotations(...)`, `ShowAnnotations(...)`
คัดลอก	`Copy(...)`, `CopyPage(pageNumber)`, `CopyMode(enabled)`

ไฟล์ JavaScript ยังมีตัวช่วยภายในด้วย. ให้ถือว่าเฉพาะเมธอดที่ใช้โดย UI อ้างอิงและที่ได้อธิบายไว้ที่นี่หรือในคู่มือคุณลักษณะเป็นจุดเชื่อมต่อที่เสถียร.

ตัวเลือกการลองใหม่

วิดเจ็ตยังรับค่า retryOn409 และการตั้งค่า backoff ของมัน (retryInitialDelayMs, retryBackoffFactor, retryMaxDelayMs, retryMaxAttempts, retryMaxTotalMs). พวกมันใช้สำหรับการปรับใช้ที่หน้าถูกสร้างในพื้นหลัง. DocImage.axd แสดงผลทุกหน้าในระหว่างคำขอ, ดังนั้นควรปิด retryOn409.

รายการตรวจสอบเส้นทาง

BasePath คือ '/' เมื่อตัวจัดการ DocImage.axd อยู่ที่รากของไซต์ — แอตทริบิวต์ path ของตัวจัดการใน Web.config กำหนดว่าจะตอบที่ไหน. ในไดเรกทอรีเสมือน, ใช้ชื่อไดเรกทอรีโดยไม่มีสแลชนำหน้า / ('myapp', ไม่ใช่ '/myapp': ตัวดูเพิ่มสแลช, และ //myapp/... เป็นคำขอไปยังโฮสต์อื่น).
DoconutOptions.ResourcesPath คือที่ที่โมดูลทรัพยากรให้บริการไฟล์ที่ฝังอยู่ (/doconut-res เป็นค่าเริ่มต้น).
ResPath ชี้ไปยังโฟลเดอร์ย่อย images ของมัน, โดยไม่มีสแลชนำหน้า / ('doconut-res/images'). การตั้งค่าให้ชี้ที่ 'doconut-res' จะทำให้ไอคอนทั้งหมดเจอ 404 แม้เอกสารยังแสดงผล.
ใน MVC, routes.IgnoreRoute("doconut-res/{*pathInfo}") ต้องตามหลัง ResourcesPath หากคุณเปลี่ยนค่า.
ExtractHyperlinks ต้องเปิดใช้งานในการกำหนดค่ารูปแบบเซิร์ฟเวอร์ก่อนที่ showHyperlinks จะสามารถแสดงอะไรได้.