Skip to main content

Dashboard

Introduction

In this tutorial we will enhance the Simple Viewer application with dashboard-like functionality, for example, retrieving and aggregating information from our design metadata, displaying the results in charts and data grids, and controlling the state of the viewer based on the interaction with these new visuals.

All the functionality in this tutorial is implemented as viewer extensions, and will only use the viewer UI, so you're free to use any APS application you want as your starting point. Note however that the names of folders, and the way you import JavaScript files into your web application, might be a little bit different.

caution

Some parts of this tutorial's code assume that your design elements contain specific properties such as Volume, Level, or Price. If you have a specific design you want to work with, you can of course modify the code to use other properties, otherwise we recommend using one of the official Revit 2022 sample project files where these properties are always present.

We will be using the Viewer API and its various features such as:

  • Creating and loading viewer extensions
  • Querying metadata of loaded models
  • Reacting to viewer events
  • Controlling the state of the viewer
  • Customizing the viewer toolbar
  • Creating custom UI elements
tip

Complete implementation of this tutorial is available in the dashboard branch of https://github.com/autodesk-platform-services/aps-simple-viewer-nodejs.

Alright, let's get started!