Updating your integration from the Sidebar Menu API to the Top Bar API

Use this guide when you have an existing NavVis IVION Frontend API integration that customizes the sidebar menu, and you need to adapt it to NavVis IVION 12.0.0.

NavVis IVION 12.0.0 introduces a redesigned interface. The left sidebar menu is replaced by a top bar, and the Sidebar Menu API is replaced by the Top Bar API, which serves a similar purpose but is adapted to the new top bar structure. Tools such as Mark & Measure and Crop & Download move to a toolbar in the main view; view controls relocate to a group above the view. The draft retains a sidebar for site setup. Features are relocated, not removed, and the REST API remains unchanged

Frontend API docs: ivion-api.docs.navvis.com
Updated Sample Application: Sample applications

For a complete map of changes, see What's New in the NavVis IVION Interface. The rest of this guide explains how these changes affect your integration.

The left sidebar menu is replaced by a new top bar. An equivalent Top Bar API replaces the public API that you use to customize the sidebar menu.

For integrations that add or modify their own top bar items, this change is mostly a rename: the methods, fields and behavior stay almost the same. The one exception is isPreviewIconVisible, which is removed with no replacement.

The following table lists what changes at a glance.

Change	Update needed	Effort
Service access path renamed: `ui.sidebarMenuService` to `ui.topBarService`	Update the reference	LOW
Item type renamed: `SidebarMenuItemInterface` to `TopBarItemInterface`	Update the type name	LOW
`isFullscreen` is now optional (default `false`)	No action needed	NONE
`isPreviewIconVisible` removed, with no replacement (the top bar is always visible)	Remove it from your items	LOW
`openMenu` and `closeMenu` now open and close the active item's dropdown, not the whole sidebar	Re-test your integration if you call these methods	LOW
`legacyApi.getMenuItems()` marked deprecated (it still works, and the return type is unchanged)	Plan to move off it over time	LOW

The customizable zone

Your custom items now appear in a single designated zone of the top bar, as shown below:

NavVis interface displaying site options, edit, and publish features for user management.

Detailed changes

Service interface: SidebarMenuServiceInterface becomes TopBarServiceInterface

The access path changes from ui.sidebarMenuService to ui.topBarService.

Old	New	What Changes
sidebarMenuService.items	topBarService.items	Rename only. Now typed as `TopBarItemInterface[]`
sidebarMenuService.goToItem(item)	topBarService.goToItem(item)	Rename only. The signature is unchanged
sidebarMenuService.getActiveItem()	topBarService.getActiveItem()	Rename only. Now typed as `TopBarItemInterface`
sidebarMenuService.openMenu()	topBarService.openMenu()	Shows the active item's dropdown. Before 12.0.0, it expanded the sidebar
sidebarMenuService.closeMenu()	topBarService.closeMenu()	Hides the active item's dropdown. Before 12.0.0, it collapsed the sidebar
sidebarMenuService.goToRoot()	topBarService.goToRoot()	Resets a menu navigation to the root

Old

New

What Changes

sidebarMenuService.items

topBarService.items

Rename only. Now typed as TopBarItemInterface[]

sidebarMenuService.goToItem(item)

topBarService.goToItem(item)

Rename only. The signature is unchanged

sidebarMenuService.getActiveItem()

topBarService.getActiveItem()

Rename only. Now typed as TopBarItemInterface

sidebarMenuService.openMenu()

topBarService.openMenu()

Shows the active item's dropdown. Before 12.0.0, it expanded the sidebar

sidebarMenuService.closeMenu()

topBarService.closeMenu()

Hides the active item's dropdown. Before 12.0.0, it collapsed the sidebar

sidebarMenuService.goToRoot()

topBarService.goToRoot()

Resets a menu navigation to the root

Item interface: SidebarMenuItemInterface becomes TopBarItemInterface

Old	New	What changes
`SidebarMenuItemInterface.items`	`TopBarItemInterface.items`	Rename only. Nesting is still supported, so an entry can open a submenu
`SidebarMenuItemInterface.title`	`TopBarItemInterface.title`	Rename only
`SidebarMenuItemInterface.icon`	`TopBarItemInterface.icon`	Rename only
`SidebarMenuItemInterface.isVisible`	`TopBarItemInterface.isVisible`	Rename only
`SidebarMenuItemInterface.order`	`TopBarItemInterface.order`	Rename only. Note that the layout direction changed. In the old vertical sidebar, a lower value placed an item closer to the top. In the new horizontal top bar, a lower value places an item closer to the left
`SidebarMenuItemInterface.getClass`	`TopBarItemInterface.getClass`	Rename only
`SidebarMenuItemInterface.onExit`	`TopBarItemInterface.onExit`	Rename only
`SidebarMenuItemInterface.onClick`	`TopBarItemInterface.onClick`	Rename only
`SidebarMenuItemInterface.template`	`TopBarItemInterface.template`	Rename only. When `isFullscreen` is `false`, your template renders inside the top bar dropdown instead of the sidebar panel, so check its layout again
`SidebarMenuItemInterface.isFullscreen`	`TopBarItemInterface.isFullscreen`	Now optional, with the default `false`. Before 12.0.0, it was required. It affects only items that use `template`: `false` renders the template inside the item's dropdown, and `true` takes over the full viewport
`SidebarMenuItemInterface.isPreviewIconVisible`	REMOVED	No replacement. The top bar is always visible, so no show or hide behavior is available to map

Legacy API

legacyApi.getMenuItems() is marked deprecated. It keeps working and its return type does not change. The plan is to migrate off it over time.

What the top bar API does not cover

Four areas of the new interface are outside its scope. If your integration adds, hides, reorders or replaces entries in these areas, that customization does not carry over to NavVis IVION 12.0.0.

Area	Elements	Not supported in the Frontend API after 12.0.0
Toolbar in the published site	All toolbar tools, such as Mark & Measure, POIs and Crop & Download	The initial release of NavVis IVION 12.0.0 does not provide an API for the toolbar. You cannot hide, reorder or extend these tools through the Frontend API. Users can still access all of them from the toolbar.
Sidebar in the draft	Dataset management, dataset alignment, site model, point cloud cleanup, navigation graph, vector map	The draft sidebar is a new component built for site setup. No Frontend API is available to customize it in 12.0.0.
View in the draft and the published site	The sidebar's View entry. Its functions are now in the view settings group at the top of the main view: 3D/2D toggle, point cloud settings, layers, scene settings	Customizing View is not supported. Its controls moved into the main view rather than into the top bar, so they are not part of the top bar item list.
Fixed top bar elements	All built-in top bar elements, in a site and on the dashboard; such as the logo, search, the site title and selector, share and user profile.	These elements are fixed. They cannot be removed, reordered or repositioned through the Frontend API.

Area

Elements

Screen reference

Not supported in the Frontend API after 12.0.0

Toolbar in the published site

All toolbar tools, such as Mark & Measure, POIs and Crop & Download

Interior view of NavVis office showing entrance, stairs, and navigation tools on the side.

The initial release of NavVis IVION 12.0.0 does not provide an API for the toolbar. You cannot hide, reorder or extend these tools through the Frontend API. Users can still access all of them from the toolbar.

Sidebar in the draft

Dataset management, dataset alignment, site model, point cloud cleanup, navigation graph, vector map

NavVis Office interface displaying dataset management and navigation options for users.

The draft sidebar is a new component built for site setup. No Frontend API is available to customize it in 12.0.0.

View in the draft and the published site

The sidebar's View entry. Its functions are now in the view settings group at the top of the main view: 3D/2D toggle, point cloud settings, layers, scene settings

A modern office space featuring a spiral staircase and seating area for collaboration.

Customizing View is not supported. Its controls moved into the main view rather than into the top bar, so they are not part of the top bar item list.

Fixed top bar elements

All built-in top bar elements, in a site and on the dashboard; such as the logo, search, the site title and selector, share and user profile.

Interior view of NavVis office showcasing open space and stairway design.

These elements are fixed. They cannot be removed, reordered or repositioned through the Frontend API.