Last active
August 23, 2023 06:56
-
-
Save yiskang/c404af571ba4d631b5929c777503891e to your computer and use it in GitHub Desktop.
Autodesk Forge Viewer's AggregatedView demo
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Multiple 3D Viewer - Autodesk Forge AggregatedView</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.*/style.min.css" type="text/css"> | |
| <style> | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="viewer"></div> | |
| <!-- The Viewer JS --> | |
| <script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/viewer3D.js"></script> | |
| <!-- Developer JS --> | |
| <script> | |
| function fetchForgeToken( callback ) { | |
| fetch( 'https://127.0.0.1:8080/api/forge/oauth/token', { | |
| method: 'get', | |
| headers: new Headers({ 'Content-Type': 'application/json' }) | |
| }) | |
| .then( ( response ) => { | |
| if( response.status === 200 ) { | |
| return response.json(); | |
| } else { | |
| return Promise.reject( | |
| new Error( `Failed to fetch token from server (status: ${response.status}, message: ${response.statusText})` ) | |
| ); | |
| } | |
| }) | |
| .then( ( data ) => { | |
| if( !data ) return Promise.reject( new Error( 'Empty token response' ) ); | |
| callback( data.access_token, data.expires_in ); | |
| }) | |
| .catch( ( error ) => console.error( error ) ); | |
| } | |
| function launchViewer( models ) { | |
| if( !models || models.length <= 0 ) | |
| return console.error( 'Empty model input' ); | |
| const options = { | |
| env: 'AutodeskProduction', | |
| getAccessToken: fetchForgeToken | |
| }; | |
| const options3d = { | |
| viewerConfig: { | |
| disableBimWalkInfoIcon: true | |
| } | |
| }; | |
| function loadManifest( documentId ) { | |
| return new Promise(( resolve, reject ) => { | |
| const onDocumentLoadSuccess = ( doc ) => { | |
| doc.downloadAecModelData(() => resolve(doc)); | |
| }; | |
| Autodesk.Viewing.Document.load( documentId, onDocumentLoadSuccess, reject ); | |
| }); | |
| } | |
| Autodesk.Viewing.Initializer( options, function() { | |
| //get the viewer div | |
| const viewerDiv = document.getElementById( 'viewer' ); | |
| //initialize the viewer object | |
| const view = new Autodesk.Viewing.AggregatedView(); | |
| view.init( viewerDiv, options3d ); | |
| const viewer = view.viewer; | |
| const tasks = []; | |
| models.forEach( md => tasks.push( loadManifest( md.urn ) ) ); | |
| Promise.all(tasks) | |
| .then( docs => Promise.resolve( docs.map( doc => { | |
| const bubbles = doc.getRoot().search({type:'geometry', role: '3d'}); | |
| const bubble = bubbles[0]; | |
| if( !bubble ) return null; | |
| return bubble; | |
| }))) | |
| .then( bubbles => view.setNodes( bubbles ) ); | |
| }); | |
| } | |
| const models = [ | |
| { name: 'A.rvt', urn: 'urn:dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6Zm9yZ2Utb3RnLWxrd2VqN3hwYmdwNjN4NGhsMzM1eTZtMjZvYWtnZ29mL0EucnZ0' }, | |
| { name: 'B.rvt', urn: 'urn:dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6Zm9yZ2Utb3RnLWxrd2VqN3hwYmdwNjN4NGhsMzM1eTZtMjZvYWtnZ29mL0IucnZ0' }, | |
| { name: 'C.rvt', urn: 'urn:dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6Zm9yZ2Utb3RnLWxrd2VqN3hwYmdwNjN4NGhsMzM1eTZtMjZvYWtnZ29mL0MucnZ0' }, | |
| { name: 'D.rvt', urn: 'urn:dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6Zm9yZ2Utb3RnLWxrd2VqN3hwYmdwNjN4NGhsMzM1eTZtMjZvYWtnZ29mL0QucnZ0' } | |
| ]; | |
| launchViewer( models.concat() ); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment