BIM 360 SDK: Part 3 - BIM 360 Viewer Component
01/30/2014
The Autodesk BIM 360 Viewer Component brings best in-class 3D model viewer technology from Autodesk and makes it available in the form of a browser plugin. It is a perfect blend of years of Navisworks R&D and the BIM 360 cloud functionalities bundled together. Users have the same experience that they have come to expect from Autodesk software including the Autodesk consistent navigation controls and View Cube. The BIM 360 Viewer is becoming the viewer of choice across the board for many Autodesk cloud and web based solutions, including Glue, Field, Digital Mock up, Point Lay out, etc.
The BIM 360 Viewer Component is an embeddable viewer that is part of the BIM 360 SDK that allows 2D/3D models from the BIM 360 Glue Platform to be visualized within custom developed web applications. The Viewer Component is based on web browser plugin technology that is supported in modern web browsers* including Internet Explorer, Chrome and Firefox.
*Viewer component is a browser plugin and not supported in iOS. The iOS component used in BIM 360 Mobile App is not available for customizations currently.
The Viewer Component is a rich and powerful means to involve or add a BIM layer to any applications without having the need to upload, download or install large files or applications. The Web Service APIs (refer: blog post) allows to get information about projects and models that are hosted in BIM 360 platform and based on the values returned specific models, or views, or even mark ups can be directly loaded to the viewer component.
For example, you can think of an ERP or Project Controls system for construction industry that handles a lot of records and data, however users/decision makers have no visual representation of the numbers or quantities or records they are analyzing. Combined with the REST APIs and the Viewer Component, now you can provide a one click access to the model components that contributed to that data in a ver light weight and manageable fashion. The illustration below shows a user accessing such an ERP system to review and make a decision and with one click launching the BIM 360 Viewer to get a better understanding of the data that leads to a more a informed decision making.
A typical implementation of the BIM 360 Glue Viewer Component can be done by embedding into a webpage using an <iframe> element. The following is a sample code snippet for a Display Component embed:
The following is an example of the "glue_viewer_component_url": (Note: newlines are included for readability only)
https://b2.autodesk.com?
company_id=demo
&api_key=ddbf3f51b3824ecbb824ae4e65d31be4
&auth_token=ddbf3f51b3824ecbb824ae4e65d31be
×tamp=1305568169
&sig=b3298cf0b4dc88450d00773b4449ba51
&runner=embedded/#<company_id>/<project_id>/<model_id>
Parameter Descriptions:
The following describes the URL parameters:
- <base_url> - this is the base URL to connect to the BIM 360 Glue viewer component. This should be defined exactly as shown
- company_id - the Company ID
- api_key - Assigned API Key
- auth_token - the access token for subsequent calls
- timestamp - the UNIX Epoch timestamp
- sig - the generated signature as described above (Note: To see full information on signing requests, see the Signing Requests section of the BIM 360 Glue Web Services API)
- <project_id> - The identifier referring to the specific BIM 360 project
- <model_id> The identifier referring to the specific model in the project
Below image shows a sample model loaded directly within the browser, with the Autodesk consistent navigation tools and the view cube active.
Alternative approach using Action IDs
BIM 360 Glue allows using a single identifier to control which entity to load into the viewer by using an Action_Id, which is a unique identifier across a Glue host. Using this approach, a client application need not build separate methods in order to load a model or a view or a markup.
By following this approach, the /<project_id>/<model_id> should be replaced with /action/<action_id> where, action_id: the action identifier to control which action to load (a model, a view, a markup, etc).
Sample Code Snippet
The below flow diagram shows how the above approach works, starting from identifying a specific entity within the BIM 360 platform which could be a model, a specific viewpoint, or a mark up and then querying the server to get the actionID for that specific entity. This is followed by building a valid URL and loading that in the Viewer Component.
Things to remember:
BIM 360 Glue Access
In order to make use of the Viewer Component and create applications, you need to have access to Autodesk BIM 360 Glue service.
Install Latest Viewer Component – browser plugin
The BIM 360 Viewer Component needs the browser plugin to be installed on the local machine. Once installed it provides a fully integrated experience and plugin runs inside a browser supplied host process that makes use of the available graphics system and performance.
The first time the BIM 360 Viewer Component is utilized, the browser prompts to install the viewer component. Click Download and Run the installer and continue with the on screen steps as below. Once complete, you should be able to load the model views right within the browser.
Supported OS and Browsers
Review the list of browsers and devices that you can use for BIM 360 Viewer component:
Operating Systems
- Windows Vista, 7 and 8
Browsers:Google Chrome, Firefox, Internet Explorer 9 and 10
Refresh Authentication Credentials
We explored how to authenticate against the Glue service and create valid signature in earlier post. The auth_token, signature, and timestamp needs to be refreshed at regular intervals (~5 minutes) before attempting a model load call into the viewer in order to avoid the server time out issues.
A common scenario due to the auth token time out is that models will fail to load and you would see an error message/banner on top viewer as below.
Troubleshooting OS Issues: On a PC running Microsoft Windows 8, if you are using Internet Explorer 10
Solution: In Internet Explorer 10, turn off Enable Protected Mode.
- In Internet Explorer 10, click Internet Options.
- In the Internet Options dialog, click the Security tab.
- Uncheck Enable Protected Mode and click Apply and OK.
Material Textures
Glue viewer component does not support material textures if the Autodesk Material library is not available on the Users machine.