erwin Evolve 2023.1.0 - System Requirements

Display Object Data with Diagram Pop-outs

This page explains how to create and use Diagram Pop-outs to display the data behind objects that appear on diagrams.

Diagram Pop-outs are used to display information about objects that appear on a diagram.

When a user clicks on an object on a diagram in the Site, a pop-out panel showing the object's details is displayed on the right of the browser window.

Diagram Pop-outs are completely customizable, so you can choose exactly what data you want to show for any given object, and you can even display different pop-outs depending on the Category of the object.

Pop-outs are constructed in a similar way to Object Pages, although you cannot use Tabs, but as such they can include properties of the object, lists of associated objects, as well as some visualizations. Behaviors are not supported in Diagram Pop-outs.

Like Object Pages, Diagram Pop-outs are Object Type specific, so you must create a pop-out for each type of object you want to view the details of.

There are two steps to getting Diagram Pop-outs working on your Site:

1. Create a Diagram Pop-out

2. Configure a page to use a Diagram Pop-out.

What do you want to do?

Create a Diagram Pop-out

To create a Diagram Pop-out:

1. In Evolve Designer, right-click the Diagram Popouts node and select Add Object Page for Object Type > [object type]

A node is added for the Object Type you selected

2. Configure your pop-out to display some object data and/or associations

You configure the pop-out to display data in a similar way to how you build an Object Page, using Property Groups and Associations. However, there is one important difference to an Object Page - you cannot use Tabs.

You can use multiple Property Groups, and you can use multiple Associations.

See here for information on using Property Groups

The Property Group Layout 'FlatList' particularly useful on Diagram Pop-outs, as it combines multiple properties in a simple display format.

3. See here for working with layouts and behaviors for Associations

4. When you have completed the configuration of your pop-out, Save it.

Configure a page to use a Diagram Pop-out

Even if you have created a Diagram Pop-out, you must configure individual pages in your Site to use it.

You can display a Diagram Pop-out on any Object Page or Index Page which is configured to display a diagram.

To configure a page to use a Diagram Pop-out:

1. On your page, select the diagram behavior node you want the pop-out to work with

The CW Modeler Diagram, Vector (HTML5), or Visualization (Automatic Diagram) node

2. Use the Diagram Popouts area to choose the pop-outs you want to use for different Object Types that appear on the diagram

Use different rows to specify different pop-outs for different Object Types or Categories of the same Object Type.

1. Use the Object Type drop-down to select the Object Type you want a pop-out for

2. Use the Category drop-down to select the Category of the Object Type you want the pop-out for - or leave the Category as 'UndefinedValue' if you want your pop-out to apply to all instances of the selected Object Type

3. Use the Diagram Popout drop-down to select the specific pop-out you want to use for the Object Type and Category combination you have chosen

3. Save and Publish your Site.

Create Category-specific Diagram Pop-outs

You can show different pop-outs for different Categories of the same Object Type.

To do this, create multiple pop-outs for one Object Type, then, when configuring your page to use the pop-outs, choose different pop-outs for different Categories of objects.

If you want to have just one Category of Object Type showing a different pop-out to the others, create a generic pop-out and set it to 'UndefinedValue' on the diagram page, then specify the Category pop-out just for that specific Category.