• Public
  • Public/Protected
  • All

Class Overview


An Overview is a Diagram that displays all of a different diagram, with a rectangular box showing the viewport displayed by that other diagram.

For more discussion, see Introduction to Overviews. See samples that make use of Overviews in the samples index.

All you need to do is set Overview.observed. For example:

  var myDiagram = new go.Diagram("myDiagramDIV");
  . . . other initialization . . .

  // create and initialize the Overview:
  new go.Overview("myOverviewDIV").observed = myDiagram;

The Overview draws what the observed Diagram is displaying, so setting or modifying any diagram templates or template Maps has no effect.

Animations are not shown in an Overview.

At the current time methods such as Diagram.makeImage, Diagram.makeImageData and Diagram.makeSvg do not work on Overviews.






  • new Overview(div?: string | Element): Overview
  • Parameters

    • Optional div: string | Element

      A reference to a div or its ID as a string.

    Returns Overview


box : Part

  • Gets or sets the rectangular Part that represents the viewport of the observed Diagram. By default the part contains only a magenta Shape. The box's Part.selectionObject is what is resized by the Overview to the apparent size of the observed diagram's viewport.

drawsTemporaryLayers : boolean

  • Gets or sets whether this overview draws the temporary layers of the observed Diagram. The default value is true. Setting this property to false may improve drawing performance, especially if the Diagram.grid is visible.

    Setting this property does not notify about any changed event.



observed : Diagram

  • Gets or sets the Diagram for which this Overview is displaying a model and showing its viewport into that model.

    The value must be null or another Diagram, but may not be an Overview.