# HTML PDF 뷰어
## Content
**wijmo.viewer 모듈**은 두 가지 종류의 뷰어를 포함합니다: **PdfViewer**와 **ReportViewer**. **PdfViewer**는 제3자 PDF 리더나 소프트웨어 없이 PDF 파일을 표시하는 가벼운 뷰어입니다. 이를 사용하여 웹 앱에서 PDF 문서를 표시할 수 있습니다.
* 포함된 주요 기능(썸네일 표시, 스크롤, 페이징, 확대/축소 기능 등)
* 인쇄 지원
* 내보내기 기능
>type=warning
> **\*참고:** Wijmo PDF Viewer는 [ComponentOne(.NET제품) Web API](https://www.grapecity.co.kr/componentone/webapi)의 [PDFDocument API](https://www.grapecity.com/componentone/docs/webapi/online-webapi/PDFDocumentServices.html)를 통해 개발된 서비스로 부터 전달된 PDF만 보여 줄 수 있습니다.
> Wijmo PDF Viewer는 단독으로 클라이언트 단의 public 경로에 있는 PDF 파일을 읽을 수 없습니다.
## 기능
문서 뷰어에서 기대할 수 있는 모든 기능을 기본적으로 제공합니다:
* 인쇄 지원
* 반응형 뷰어
* 썸네일
* 검색
* 페이지네이션
* 전체 화면 및 크기 조정
* 연속 스크롤 옵션
## 기본 설정
C1 Web API PDFDocument Services에서 PDF 파일을 표시하려면 다음과 같은 기본 속성을 설정합니다:
1. **serviceUrl**: C1 Web API PDFDocument Services의 URL
2. **filePath**: PDF 파일의 전체 경로. (예: 'PdfRoot/DefaultDocument.pdf')
여기서 'PdfRoot'는 PDF 파일이 저장된 디스크 저장소 제공자의 키이며, 서버에서 해당 PDF 파일을 찾는 데 사용됩니다.
3. 'DefaultDocument.pdf' 는 해당 파일의 상대 경로로, 디스크 저장소 제공자에 의해 지정된 PDF 파일을 찾는 데 사용됩니다.
##### 예제
```html
...
...
```
```javascript
let pdfViewer = new viewer.PdfViewer('#pdfViewer', {
serviceUrl: 'https://developer.mescius.com/componentone/demos/aspnet/c1webapi/latest/api/pdf',
filePath: 'PdfRoot/DefaultDocument.pdf',
zoomFactorChanged: (sender) => {
zoomFactor.value = sender.zoomFactor;
}
});
```
C1 Web API PDFDocument Services는 **C1PdfDocumentSource**를 사용하여 PDF 파일을 렌더링하고 내보냅니다. 설정 방법에 대한 자세한 내용은 **C1 Web API PDFDocument Services 설정 방법**을 참조하십시오.
또한 **PdfViewer** 컨트롤에는 다음과 같은 속성이 있어, 뷰어의 외형과 동작을 사용자 지정할 수 있습니다:
* **fullScreen**: 뷰어가 전체 화면 모드인지 여부를 나타냅니다.
* **mouseMode**: 마우스 동작 방식을 나타냅니다.
* **viewMode**: 문서 페이지를 표시하는 방법을 나타냅니다.
* **zoomFactor**: 문서 페이지를 표시할 때 현재 확대 비율을 나타냅니다.
##### 예제
```javascript
pdfViewer.fullScreen = true;
pdfViewer.mouseMode = wijmo.viewer.MouseMode.MoveTool;
pdfViewer.viewMode = wijmo.viewer.zoomMode.WholePage;
```