Popup Dialog Box

On Dragon1, people can view visualizations in the Viewer.

Sometimes you, as a creator of a visualization, want to provide more background or detailed information to viewers than there is space for on the visualization in the Viewer.

Or you want to provide a click-through link to another visualization.

In these cases it is handy to make use of Popup Dialog Boxes.

It is very easy to make use of it because the mechanism is already build-in for you in the Viewer.

Getting Dialog Boxes Generated on Mouse Over

In order to get Popup Dialog Boxes generated on a mouse over in your diagram in the Viewer, do the following:

  • Select a visualization in the Visual Designer
  • Select a shape in a visualization
  • Click right mouse button
  • Click on Edit Data
  • Enter a Title, Description and Valid bitmap url like is shown in the screenshot below
  • Save your visualization
  • Make sure your visualization is published
  • Go to the Viewer
  • Select your visualization
  • For all the shapes that have a description, automatically on mouse over a dialog is generated

Using Links

You can place links (URLs) to places inside and outside Dragon1, like for instance another web application or website. But mostly you will link to other visualizations. You can do this by adding a field in the Dialog of a shape on a visualization.

  • Select a shape in a visualization
  • Click right mouse button
  • Click on Edit Data
  • Add the field linkurl like in the example below
  • Click OK
  • Save your visualization.

Now when a viewer clicks on a shape in the left bar, a link will appear. Users can click on it and are then forwarded to another visualization or other resource.

Using Video as Image

You can place a link to a video as an image in your shape Dialog.

In the source URL field you add a video link, and then when the viewer clicks on it, in the left bar, the viewer can play the video.

Uploading Images

Your account provides a sites folder section. This section can be accessed via https://www.dragon1.com/resourcecenter-upload.

You can link to the images uploaded here in the sourceurl and linkurl fields in the shape Properties dialog.

Example Screenshots of Popup Dialog Boxes

dragon1 popup diagog boxes

How to enter data in a Properties Dialog of a shape.

Here a shape was first selected and then via right mouse and clicking Edit Data this dialog appeared.

dragon1 popup diagog boxes

The visualization shows a Popup Dialog Box on mouseover on a shape.

dragon1 visualization showing video

The visualization shows a video in the left bar.