Autodesk Forge Viewer v7：打开 PDF

Question

我对 Viewer v7 有一些疑问，但在教程和 API-References 中找不到任何答案。

我想做的事情： 我想使用 Forge Datamanagment API 将 PDF 上传到 Forge，然后通过 Viewer

打开它

到目前为止我做了什么：我设法将 PDF 文件上传到 Forge 并将其翻译成 SVF。

但是，到目前为止，当我想使用查看器打开 PDF 时，我得到的只是一个空白页面。我遵循了这个 tutorial，另外我添加了扩展名 Autodesk.PDF。这就是我的代码的样子：

Autodesk.Viewing.Initializer(options, () => {
   this.viewer = new Autodesk.Viewing.GuiViewer3D(this.viewerDiv);
   this.viewer.loadExtension("Autodesk.PDF").then(() => {
        const startedCode = this.viewer.start();
        if (startedCode > 0) {
            console.error('Failed to create a Viewer: WebGL not supported.');
            return;
        }
        Autodesk.Viewing.Document.load(urn, (doc) => this.onDocumentLoadSuccess(doc), (err) => this.onDocumentLoadFailure(err));
   });
});

onDocumentLoadSuccess(doc) {
   var defaultModel = doc.getRoot().getDefaultGeometry();
   this.viewer.loadDocumentNode(doc, defaultModel);
}

onDocumentLoadFailure(viewerErrorCode) {
   this.handleError('Error loading document', viewerErrorCode);
}

对于 IFC 文件，这可以正常工作，但不适用于 PDF 文件。

我看过一些使用 loadModel 函数的教程，该函数将 URL 作为输入，无需翻译即可打开 PDF 文件。

所以这是我的问题：

我什至需要翻译我的 PDF 文件才能在查看器中打开它吗？
尽管转换为 SVF 成功，但为什么查看器适用于 IFC 文件而不适用于 PDF 文件？
我可以将 loadModel 函数也与 URN 一起使用吗（所以 base64 编码的 objectId）？

提前致谢

Answer 1

Q1：我什至需要翻译我的 PDF 文件才能在查看器中打开它吗？

A1: 是的！根据 Forge Viewer 的使用条款，Autodesk Forge 查看器只能用于查看由 Autodesk Forge 服务生成的文件

/*!
 * LMV v7.6.1
 * 
 * Copyright 2019 Autodesk, Inc.
 * All rights reserved.
 * 
 * This computer source code and related instructions and comments are the
 * unpublished confidential and proprietary information of Autodesk, Inc.
 * and are protected under Federal copyright and state trade secret law.
 * They may not be disclosed to, copied or used by any third party without
 * the prior written consent of Autodesk, Inc.
 * 
 * Autodesk Forge Viewer Usage Limitations:
 * 
 * The Autodesk Forge viewer can only be used to view files generated by
 * Autodesk Forge services. The Autodesk Forge Viewer JavaScript must be
 * delivered from an Autodesk hosted URL.
 */

问题 2： 为什么 Viewer 对 IFC 文件有效，但对 PDF 文件无效，尽管转换为 SVF 成功？

A2: 请提供来自 GET:urn/manifest

的错误消息

问题 3： 我可以将 loadModel 函数也与 URN 一起使用吗（所以 base64 编码的 objectId）？

A3: 是的，如果我没理解错的话。这是代码片段和截屏视频：https://knowledge.autodesk.com/community/screencast/de6b2d2a-c6b3-4747-8664-bd79cf417765

<!DOCTYPE html>
<html>
  <head>
    <title>PDF Viewer</title>
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta charset="utf-8">

    <!-- The Viewer CSS -->
    <link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.6.*/style.min.css" type="text/css">
    <style>
      * {
        margin: 0;
        padding: 0;
      }

      /* Create two unequal columns that floats next to each other */
      .column {
        float: left;
        height: 100vh;
      }

      .left {
        width: 10%;
      }

      .right {
        width: 90%;
      }

      /* Clear floats after the columns */
      .row:after {
        content: "";
        position: relative;
        display: inline-block;
        clear: both;
      }

      #pdf-pages-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        overflow-y: scroll;
      }

      #pdf-pages-wrapper ul {
        padding-left: 20px;
      }

      #pdf-pages-wrapper a {
        color: black;
        text-decoration: none;
      }

      #pdf-pages-wrapper a.active {
        font-weight: bold;
        color: blue;
        text-decoration: underline;
      }

      #viewer {
        position: relative;
        width: 100%;
        height: 100%;
      }
    </style>
  </head>

  <body>
    <div class="row">
      <div class="column left">
        <div id="pdf-pages-wrapper"></div>
      </div>
      <div class="column right">
          <div id="viewer"></div>
      </div>
    </div>

    <!-- The Viewer JS -->
    <script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.6.*/viewer3D.js"></script>

    <!-- Developer JS -->
    <script>
      class PdfData {
          constructor( document ) {
            this.doc = document;
            this.pages = [];
          }

          parse() {
            const filter = {
              type:'geometry',
              role: '2d'
            };

            const doc = this.doc;
            const rootItem = doc.getRoot();
            const viewables = rootItem.search( filter );

            if( viewables.length === 0 ) {
              console.error( 'Document contains no viewables.' );
              return false;
            }

            const pages = viewables.map( v => {
              const files = v.search( { role: 'pdf-page' } );
              const file = files[0];

              if( !file ) return;
              const urn = file.data.urn;

              return {
                guid: v.guid(),
                raw: v,
                name: v.name(),
                urn,
                url: function() {
                  return Autodesk.Viewing.endpoint.getItemApi() + urn;
                }
              };
            });

            this.pages = pages;

            if( !pages || pages.length <= 0 )
              return false;

            return true;
          }
        }

        let viewer;
        const options = {
            env: 'AutodeskProduction',
            accessToken: 'YourAccessToken'
        };

        const documentId = 'urn:dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6bXlidWNrZXQvRTE1MDEyX1RVRl9aMzkwTS1QUk9fR0FNSU5HX1dpLUZpX1VNX1YyX1dFQi5wZGY';
        Autodesk.Viewing.Initializer(options, function() {
          Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);
        });

        function onDocumentLoadSuccess( doc ) {
          buildPdfPageList( doc );

          const container = document.getElementById( 'viewer' );
          viewer = new Autodesk.Viewing.GuiViewer3D( container );
          viewer.start();

          viewer.loadExtension( 'Autodesk.PDF' ).then( () => {
            const event = new Event( 'click' );
            const page = document.querySelector( '#pdf-pages-wrapper a' );
            page.dispatchEvent( event );
          });
        }

        function onDocumentLoadFailure(viewerErrorCode) {
          console.error('onDocumentLoadFailure() - errorCode:' + viewerErrorCode);
        }

        function onLoadModelSuccess(model) {
          console.log( 'onLoadModelSuccess()!' );
          console.log( 'Validate model loaded: ' + ( viewer.model === model ) );
          console.log( model );
        }

        function onLoadModelError( viewerErrorCode ) {
            console.error( 'onLoadModelError() - errorCode:' + viewerErrorCode);
        }

        function buildPdfPageList( doc ) {
          const pdf = new PdfData( doc );
          pdf.parse();
          const pageWrapperContainer = document.getElementById( 'pdf-pages-wrapper' );
          const pagesContainer = document.createElement( 'ul' );
          pageWrapperContainer.appendChild( pagesContainer );

          for( let i=0; i < pdf.pages.length; i++ ){
            const page = pdf.pages[i];
            console.log( page );
            const pageHolder = document.createElement( 'li' );
            pagesContainer.appendChild( pageHolder );

            const pageItem = document.createElement( 'a' );
            pageHolder.appendChild( pageItem );

            pageItem.href = '#';
            pageItem.innerText = page.name;
            pageItem.addEventListener( 'click', ( e ) => {
              e.preventDefault();
              e.stopPropagation();

              document.querySelectorAll( '#pdf-pages-wrapper a' ).forEach( e => e.classList.remove( 'active' ) );
              e.target.classList.add( 'active' );

              viewer.tearDown();
              const url = page.url();

              console.log( page, url );
              viewer.loadModel( url, {page: 1}, onLoadModelSuccess, onLoadModelError );
            });
          }
        }
    </script>
  </body>
</html>

Autodesk Forge Viewer v7：打开 PDF

Autodesk Forge Viewer v7: Open PDFs

autodesk-forge

autodesk-viewer