Basics
The Viewer is a client-side JavaScript library for 2D and 3D model rendering. It supports viewing a wide variety of 2D and 3D model file formats by first translating to SVF using the Model Derivative API.
With the help of the Model Derivative API, developers can upload their design files (also called “seed files”) and have them translated into the appropriate format. Once the process has completed, the Viewer will be able to consume these translated files.
Terminology
| Term | Definition |
|---|---|
| seed file | the original model file that you want to visualize in the viewer |
| manifest | the result of the translation process, a structured
collection of resources (e.g., model geometry,
thumbnails, camera views) used by the Viewer
Get a manifest using the GET :urn/manifest endpoint.
The Viewer can only render viewables.
|
| access token | An access token (sometimes just “token” or “bearer token”) is returned at the end of a successful
authentication flow.
It is required that tokens for the Viewer have scope
viewables:read.For more information, see the Authentication API Basics and Scopes sections.
|
| viewable | either a 3D model or a 2D sheet referenced by the manifest |
| headless | the Viewer without UI elements; only the 3D render canvas |
| measure | feature for measuring distances in the rendered geometry |
| markup | feature for annotating viewables |
| section(ing) | feature for cutting 3D models and see inside of them |
| search | feature for searching the viewable’s metadata, also called “property database” |
| property database | metadata associated with a viewable and its parts; may contains metadata for each geometry node |
| geometry node | a selectable entity in the viewable |
| extensions | JavaScript code that extends or modifies the Viewer’s
behavior
Some extensions are bundled with the Viewer, and developers
can write their own.
|
Check out our Field Guide for additional terms related to the JavaScript codebase.
Getting the Code
The latest codebase for The Viewer can be included from Autodesk’s CDN
<link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/style.min.css" type="text/css">
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/three.min.js"></script>
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/viewer3D.min.js"></script>
Getting the latest version of the codebase is a great way of getting started. However, we strongly recommend that web applications deployed to production instead make use of a specific version of the Viewer code.
For example, if a developer wants to force version 2.7 to be fetched, then all requests above need to have their href or src tags appended with ?v=2.7.*:
<link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/style.min.css?v=2.7.*" type="text/css">
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/three.min.js?v=2.7.*"></script>
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/viewer3D.min.js?v=2.7.*"></script>
Visit the Recent Changes page to see the list of available versions.
Developers can validate that the code fetched is the correct version through the global LMV_VIEWER_VERSION variable defined by the Viewer. Following the example above, the string value would be 2.7.
Loading a Design File
The translation of a seed file using the Model Derivative API is identified by a uniform resource name (URN). Provide this URN to the Viewer, and it will fetch all additional resources required to render the scene.
Check out the Step-by-Step Tutorials to see how to use the URN to load a particular design file.
A 3D Design
At the bottom, there is the default toolbar UI. In the top right you’ll find the ViewCube, a tool that helps orienting the camera view on the model.
A 2D Design
The default toolbar is also available when viewing 2D models. Some of the toolbar buttons are unique to the whether the model is 2D or 3D. For example, the section and explode features are only available in 3D models.
The ViewCube will not be visible when viewing 2D models.