예시 및 데모
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
아래에는 빠르게 참조할 수 있도록 Embedded Viewer API 문서 집합에 포함된 모든 예시가 나와 있습니다. 또한 고급 개념을 설명하기 위해 여러 가지 추가 데모가 포함되어 있습니다.
개발자 가이드의 예
이러한 기본 예는 개발자 가이드에 나와 있으며 Embedded Viewer API의 가장 일반적인 용도를 다룹니다.
- book-simple
Embedded Viewer API의 'Hello, World' 예시로 이 예에서는 API를 로드하고 특정 도서로 뷰어를 그리는 방법을 보여줍니다.
- book-language
이 예에서는 뷰어의 인터페이스 언어(이 경우 브라질 포르투갈어)를 변경하는 방법을 보여줍니다.
- book-notfound
시청자가 지정된 도서를 로드할 수 없을 때 호출되는 콜백 함수를 추가하는 방법을 보여줍니다. 이 예를 기반으로 이러한 조건을 적절하게 처리할 수 있습니다.
- book-success
시청자가 도서를 초기화하고 프로그래밍 방식으로 조작할 준비가 되었을 때 호출되는 콜백 함수를 추가하는 방법을 보여줍니다.
- book-animate
JavaScript를 사용하여 뷰어를 프로그래매틱 방식으로 제어하는 방법을 보여주기 위해 3초마다 다음 페이지로 자동으로 넘어가는 미리보기가 표시됩니다.
프로그래매틱 방식으로 뷰어 제어
뷰어를 사용하면 사용자가 뷰어와 상호작용하여 할 수 있는 거의 모든 작업을 코드로 수행할 수 있습니다. 아래 예는 이 방법이 어떻게 유용한지 보여줍니다.
Books API 및 동적 링크와 결합
고급 애플리케이션을 빌드할 때 Embedded Viewer API를 Books API 또는 동적 링크 기능과 결합하는 것이 유용할 수 있습니다. 예를 들어 특정 미리보기를 삽입할 수 있는지 미리 알면 유용할 수 있습니다 (예: 사용자에게 사이트의 미리보기 창을 여는 옵션을 제공할지 여부를 결정하려는 경우). 또는 특정 도서의 식별자를 모를 수 있으며 먼저 Books API를 사용하여 '조회'하려고 할 수 있습니다. 아래 예는 이러한 작업을 실행하는 방법을 보여줍니다.
- book-dynamiclinks-zippy
여기에서 먼저 도서를 삽입할 수 있는지 확인합니다. 사용 가능한 경우에만 '미리보기 섹션'을 렌더링하며, 이 섹션을 클릭하면 도서 미리보기가 인라인으로 표시됩니다.
- booksapi-titlesearch
이 예시에서는 도서에 대한 검색어를 입력하기만 하면 삽입된 뷰어를 열 수 있습니다. 입력한 검색어에 대한 첫 번째 삽입 가능한 결과가 자동으로 표시됩니다. Data API의 JSON 출력 형식을 사용하여 검색 결과에 액세스합니다.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2024-06-28(UTC)
[null,null,["최종 업데이트: 2024-06-28(UTC)"],[[["\u003cp\u003eThis documentation provides a comprehensive list of examples for Google Books Embedded Viewer API.\u003c/p\u003e\n"],["\u003cp\u003eExamples cover basic viewer setup, language settings, error handling, and programmatic control functionalities.\u003c/p\u003e\n"],["\u003cp\u003eDevelopers can learn to integrate the viewer with the Books API and Dynamic Links for advanced functionalities.\u003c/p\u003e\n"],["\u003cp\u003eSample code demonstrates interactions like zooming, navigation, and highlighting within the embedded viewer.\u003c/p\u003e\n"],["\u003cp\u003eUse cases include creating book previews, searching for books, and handling embedding availability.\u003c/p\u003e\n"]]],[],null,["# Examples and Demos\n\nAll of the examples contained within the Embedded Viewer API documentation set are listed below for quick reference. In addition, a number of additional demos are included to illustrate advanced concepts.\n\nExamples from the Developer's Guide\n-----------------------------------\n\nThese basic examples appear in the [Developer's Guide](/books/docs/viewer/developers_guide) and cover the most common uses of the Embedded Viewer API.\n\n- [book-simple](/books/docs/viewer/examples/book-simple) \n The \"Hello, World\" example of the Embedded Viewer API, this example indicates how to load the API and draw a viewer with a particular book.\n- [book-language](/books/docs/viewer/examples/book-language) \n This example shows how to change the viewer's interface language, in this case to Brazilian Portuguese.\n- [book-notfound](/books/docs/viewer/examples/book-notfound) \n This shows how to add a callback function which is called when the viewer could not load the specified book. You can build on this example to gracefully handle such conditions.\n- [book-success](/books/docs/viewer/examples/book-success) \n This shows how to add a callback function which is called when the viewer has successfully initialized with a book and is ready to be manipulated programatically.\n- [book-animate](/books/docs/viewer/examples/book-animate) \n To illustrate how the viewer can be controlled programmatically using JavaScript, a preview is shown which automatically flips to the next page every 3 seconds.\n\nProgrammatic control of the viewer\n----------------------------------\n\nThe viewer allows you to do with code almost anything the user can do by interacting with the the viewer. The examples below show how this might be useful.\n\n- [book-interactions-controls](/books/docs/viewer/examples/book-interactions-controls) \n This working example enumerates all the interaction methods supported by the viewer, including zoom, nextPage, goToPage, and highlighting functions.\n- [book-interactions-openatpage](/books/docs/viewer/examples/book-interactions-openatpage) \n Shows how to automatically open a book viewer on a particular page, using callbacks and the goToPage function.\n\nCombining with the Books API and Dynamic Links\n----------------------------------------------\n\nWhen building advanced applications, you may find it useful to combine\nthe Embedded Viewer API with either the [Books API](/books/docs/v1/getting_started) or the\n[Dynamic Links](/books/docs/dynamic-links)\nfeature. For example, it may be useful to know in advance whether a particular\npreview will be available for embedding (e.g., to determine whether to give the\nuser the option to open a preview window on your site). Or, you may not know the\nidentifier for a particular book, and want to first \"look it up\" using the Books\nAPI. The examples below indicate how to perform these operations.\n\n- [book-dynamiclinks-zippy](/books/docs/viewer/examples/book-dynamiclinks-zippy) \n Here we check whether a book is available for embedding first. If and only if it is available, we render a \"preview zippy,\" which, when clicked, shows the book preview inline.\n- [booksapi-titlesearch](/books/docs/viewer/examples/booksapi-titlesearch) \n This example allows you open an embedded viewer by simply entering a search query for a book. It will automatically show the first embeddable result for the query you enter. This uses the JSON output format of the Data API to access the search results."]]