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. All you need to do is set Overview#observed.

Hierarchy

Index

Constructor methods

Properties

Methods

Constructor methods

constructor(div: HTMLDivElement): Overview

Parameters

  • div: HTMLDivElement

    A reference to a DIV element in the DOM.

Returns

Overview

constructor(id?: string): Overview

Parameters

  • id?: string optional

    A reference to a DIV by its ID as a string.

Returns

Overview

Properties

public allowClipboard: boolean

Gets or sets whether the user may copy to or paste parts from the internal clipboard.

public allowCopy: boolean

Gets or sets whether the user may copy objects.

public allowDelete: boolean

Gets or sets whether the user may delete objects from the Diagram.

public allowDragOut: boolean

Gets or sets whether the user may start a drag-and-drop in this Diagram, possibly dropping in a different element.

public allowDrop: boolean

Gets or sets whether the user may end a drag-and-drop operation in this Diagram.

public allowGroup: boolean

Gets or sets whether the user may group parts together.

public allowHorizontalScroll: boolean

Gets or sets whether the user is allowed to use the horizontal scrollbar.

public allowInsert: boolean

Gets or sets whether the user may add parts to the Diagram.

public allowLink: boolean

Gets or sets whether the user may draw new links.

public allowMove: boolean

Gets or sets whether the user may move objects.

public allowRelink: boolean

Gets or sets whether the user may reconnect existing links.

public allowReshape: boolean

Gets or sets whether the user may reshape parts.

public allowResize: boolean

Gets or sets whether the user may resize parts.

public allowRotate: boolean

Gets or sets whether the user may rotate parts.

public allowSelect: boolean

Gets or sets whether the user may select objects.

public allowTextEdit: boolean

Gets or sets whether the user may do in-place text editing.

public allowUndo: boolean

Gets or sets whether the user may undo or redo any changes.

public allowUngroup: boolean

Gets or sets whether the user may ungroup existing groups.

public allowVerticalScroll: boolean

Gets or sets whether the user is allowed to use the vertical scrollbar.

public allowZoom: boolean

Gets or sets whether the user may zoom into or out of the Diagram.

public autoScale: EnumValue

Gets or sets the autoScale of the Diagram, controlling whether or not the Diagram's bounds automatically scale to fit the view.

public autoScrollRegion: any

Gets or sets the Margin (or number for a uniform Margin) that describes the Diagram's autoScrollRegion.

public box: Part

Gets or sets the rectangular Part that represents the viewport of the #observed Diagram.

public click: (e: go.InputEvent) => void

Gets or sets the function to execute when the user single-primary-clicks on the background of the Diagram.

public commandHandler: CommandHandler

Gets or sets the CommandHandler for this Diagram.

public contentAlignment: Spot

Gets or sets the content alignment Spot of this Diagram, to be used in determining how parts are positioned when the #viewportBounds width or height is smaller than the #documentBounds.

public contextClick: (e: go.InputEvent) => void

Gets or sets the function to execute when the user single-secondary-clicks on the background of the Diagram.

public contextMenu: Adornment

This Adornment is shown when the use context clicks in the background.

public currentCursor: string

Gets or sets the current cursor for the Diagram, overriding the #defaultCursor.

public currentTool: Tool

Gets or sets the current tool for this Diagram that handles all input events.

public defaultCursor: string

Gets or sets the cursor to be used for the Diagram when no GraphObject specifies a different cursor.

public defaultTool: Tool

Gets or sets the default tool for this Diagram that becomes the current tool when the current tool stops.

public div: HTMLDivElement

Gets or sets the Diagram's HTMLDivElement, via an HTML Element ID.

public documentBounds: Rect

Gets the model-coordinate bounds of the Diagram.

public doubleClick: (e: go.InputEvent) => void

Gets or sets the function to execute when the user double-primary-clicks on the background of the Diagram.

public drawsTemporaryLayers: boolean

Gets or sets whether this overview draws the temporary layers of the observed Diagram.

public firstInput: InputEvent

Gets or sets the most recent mouse-down InputEvent that occurred.

public fixedBounds: Rect

Gets or sets a fixed bounding rectangle to be returned by #documentBounds and #computeBounds.

public grid: Panel

Gets or sets a Panel of type Panel#Grid acting as the background grid extending across the whole viewport of this diagram.

public groupSelectionAdornmentTemplate: Adornment

Gets or sets the default selection Adornment template, used to adorn selected Groups.

public groupTemplate: Group

Gets or sets the default Group template used as the archetype for group data that is added to the #model.

public groupTemplateMap: Map

Gets or sets a Map mapping template names to Groups.

public hasHorizontalScrollbar: boolean

Gets or sets whether the Diagram has a horizontal Scrollbar.

public hasVerticalScrollbar: boolean

Gets or sets whether the Diagram has a vertical Scrollbar.

public initialAutoScale: EnumValue

Gets or sets the initialAutoScale of the Diagram.

public initialContentAlignment: Spot

Gets or sets the initial content alignment Spot of this Diagram, to be used in determining how parts are positioned initially relative to the viewport.

public initialDocumentSpot: Spot

Gets or sets the spot in the document's area that should be coincident with the #initialViewportSpot of the viewport when the document is first initialized.

public initialPosition: Point

Gets or sets the initial coordinates of this Diagram in the viewport, eventually setting the #position.

public initialScale: number

Gets or sets the initial scale of this Diagram in the viewport, eventually setting the #scale.

public initialViewportSpot: Spot

Gets or sets the spot in the viewport that should be coincident with the #initialDocumentSpot of the document when the document is first initialized.

public isEnabled: boolean

Gets or sets whether the user may interact with the Diagram.

public isModelReadOnly: boolean

Gets or sets whether the Diagram's Diagram#model is Model#isReadOnly.

public isModified: boolean

Gets or sets whether this Diagram's state has been modified.

public isMouseCaptured: boolean

Gets or sets whether mouse events initiated within the Diagram will be captured.

public isReadOnly: boolean

Gets or sets whether the Diagram may be modified by the user, while still allowing the user to scroll, zoom, and select.

public isTreePathToChildren: boolean

Gets or sets whether the Diagram tree structure is defined by links going from the parent node to their children, or vice-versa.

public lastInput: InputEvent

Gets or sets the last InputEvent that occurred.

public layers: Iterator

Gets an iterator for this Diagram's Layers.

public layout: Layout

Gets or sets the Layout used to position all of the top-level nodes and links in this Diagram.

public linkSelectionAdornmentTemplate: Adornment

Gets or sets the default selection Adornment template, used to adorn selected Links.

public linkTemplate: Link

Gets or sets the default Link template used as the archetype for link data that is added to the #model.

public linkTemplateMap: Map

Gets or sets a Map mapping template names to Links.

public links: Iterator

Returns an iterator of all Links in the Diagram.

public maxScale: number

Gets or sets the largest value that #scale may take.

public maxSelectionCount: number

Gets or sets the maximum number of selected objects.

public minScale: number

Gets or sets the smallest value greater than zero that #scale may take.

public model: Model

Gets or sets the Model holding data corresponding to the data-bound nodes and links of this Diagram.

public mouseDragOver: (e: go.InputEvent) => void

Gets or sets the function to execute when the user is dragging the selection in the background of the Diagram during a DraggingTool drag-and-drop, not over any GraphObjects.

public mouseDrop: (e: go.InputEvent) => void

Gets or sets the function to execute when the user drops the selection in the background of the Diagram at the end of a DraggingTool drag-and-drop, not onto any GraphObjects.

public mouseHold: (e: go.InputEvent) => void

Gets or sets the function to execute when the user holds the mouse stationary in the background of the Diagram while holding down a button, not over any GraphObjects.

public mouseHover: (e: go.InputEvent) => void

Gets or sets the function to execute when the user holds the mouse stationary in the background of the Diagram without holding down any buttons, not over any GraphObjects.

public mouseOver: (e: go.InputEvent) => void

Gets or sets the function to execute when the user moves the mouse in the background of the Diagram without holding down any buttons, not over any GraphObjects.

public nodeSelectionAdornmentTemplate: Adornment

Gets or sets the default selection Adornment template, used to adorn selected Parts other than Groups or Links.

public nodeTemplate: Part

Gets or sets the default Node template used as the archetype for node data that is added to the #model.

public nodeTemplateMap: Map

Gets or sets a Map mapping template names to Parts.

public nodes: Iterator

Returns an iterator of all Nodes and Groups in the Diagram.

public observed: Diagram

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

public padding: any

Gets or sets the Margin (or number for a uniform Margin) that describes the Diagram's padding, which controls how much extra space there is around the area occupied by the document.

public parts: Iterator

Returns an iterator of all Parts in the Diagram that are not Nodes or Links or Adornments.

public position: Point

Gets or sets the coordinates of this Diagram in the viewport.

public scale: number

Gets or sets the scale transform of this Diagram.

public scrollHorizontalLineChange: number

Gets or sets the distance in screen pixels that the horizontal scrollbar will scroll when scrolling by a line.

public scrollVerticalLineChange: number

Gets or sets the distance in screen pixels that the vertical scrollbar will scroll when scrolling by a line.

public selection: Set

Gets the read-only collection of selected objects.

public skipsUndoManager: boolean

Gets or sets whether ChangedEvents are not recorded by the UndoManager.

public toolManager: ToolManager

Gets the UndoManager for this Diagram, which actually belongs to the #model.

public toolTip: Adornment

This Adornment is shown when the mouse stays motionless in the background.

public undoManager: UndoManager

Gets the UndoManager for this Diagram, which actually belongs to the #model.

public validCycle: EnumValue

Gets or sets what kinds of graphs this diagram allows the user to draw.

public viewportBounds: Rect

Gets the bounds of the portion of the Diagram that is viewable from its HTML Canvas.

public zoomPoint: Point

Gets or sets the point, in viewport coordinates, where changes to the #scale will keep the focus in the document.

Methods

public add(part: Part): any

Adds a Part to the Layer that matches the Part's Part#layerName, or else to the default layer, which is named with the empty string.

Parameters

Returns

any

public addChangedListener(listener: (e: go.ChangedEvent) => void): any

Register an event handler that is called when there is a ChangedEvent.

Parameters

  • listener: (e: go.ChangedEvent) => void

    a function that takes a ChangedEvent as its argument.

Returns

any

public addDiagramListener(name: string, listener: (e: go.DiagramEvent) => void): any

Register an event handler that is called when there is a DiagramEvent of a given name.

Parameters

  • name: string

    the name is normally capitalized, but this method uses case-insensitive comparison.

  • listener: (e: go.DiagramEvent) => void

    a function that takes a DiagramEvent as its argument.

Returns

any

public addLayer(layer: Layer): any

Adds a Layer to the list of layers.

Parameters

  • layer: Layer

    The Layer to add.

Returns

any

public addLayerAfter(layer: Layer, existingLayer: Layer): any

Adds a layer to the list of layers after a specified layer.

Parameters

  • layer: Layer

    The Layer to add.

  • existingLayer: Layer

    The layer to insert after.

Returns

any

public addLayerBefore(layer: Layer, existingLayer: Layer): any

Adds a layer to the list of layers before a specified layer.

Parameters

  • layer: Layer

    The Layer to add.

  • existingLayer: Layer

    The layer to insert before.

Returns

any

public alignDocument(documentspot: Spot, viewportspot: Spot): any

Aligns the Diagram's #position based on a desired document Spot and viewport Spot.

Parameters

Returns

any

public centerRect(r: Rect): any

Modifies the #position to show a given Rect of the Diagram by centering the viewport on that Rect.

Parameters

Returns

any

public clear(): any

Removes all Parts from the Diagram, including unbound Parts and the background grid, and also clears out the Model and UndoManager.

Returns

any

public clearSelection(): any

Deselect all selected Parts.

Returns

any

public commitTransaction(tname: string): boolean

Commit the changes of the current transaction.

Parameters

  • tname: string

    a descriptive name for the transaction.

Returns

boolean

public computeBounds(): Rect

This is called during a Diagram update to determine a new value for #documentBounds.

Returns

Rect

public computePartsBounds(coll: Iterable): Rect

Find the union of the GraphObject#actualBounds of all of the Parts in the given collection.

Parameters

Returns

Rect

public delayInitialization(func?: () => void): any

Updates the diagram immediately, then resets initialization flags so that actions taken in the argument function will be considered part of Diagram initialization, and will participate in initial layouts, #initialAutoScale, #initialContentAlignment, etc.

Parameters

  • func?: () => void optional

    an optional function of actions to perform as part of another diagram initialization.

Returns

any

public findLayer(name: string): Layer

Finds a layer with a given name.

Parameters

  • name: string

Returns

Layer

public findLinkForData(linkdata: Object): Link

Look for a Link corresponding to a GraphLinksModel's link data object.

Parameters

  • linkdata: Object

Returns

Link

public findNodeForData(nodedata: Object): Node

Look for a Node or Group corresponding to a model's node data object.

Parameters

  • nodedata: Object

Returns

Node

public findNodeForKey(key: any): Node

Look for a Node or Group corresponding to a model's node data object's unique key.

Parameters

  • key: any

    a string or number.

Returns

Node

public findObjectAt(p: Point, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean): GraphObject

Find the front-most GraphObject at the given point in document coordinates.

Parameters

  • p: Point

    A Point in document coordinates.

  • navig?: (obj: go.GraphObject) => go.GraphObject optional

    A function taking a GraphObject and returning a GraphObject, defaulting to the identity.

  • pred?: (obj: go.GraphObject) => boolean optional

    A function taking the GraphObject returned by navig and returning true if that object should be returned, defaulting to a predicate that always returns true.

Returns

GraphObject

public findObjectsAt(p: Point, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean, coll?: List): Iterable

Return a collection of the GraphObjects at the given point in document coordinates.

Parameters

  • p: Point

    A Point in document coordinates.

  • navig?: (obj: go.GraphObject) => go.GraphObject optional

    A function taking a GraphObject and returning a GraphObject, defaulting to the identity. If this function returns null, the given GraphObject will not be included in the results.

  • pred?: (obj: go.GraphObject) => boolean optional

    A function taking the GraphObject returned by navig and returning true if that object should be returned, defaulting to a predicate that always returns true.

  • coll?: List optional

    An optional collection (List or Set) to add the results to.

Returns

Iterable

public findObjectsAt(p: Point, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean, coll?: Set): Iterable

Parameters

  • p: Point
  • navig?: (obj: go.GraphObject) => go.GraphObject optional
  • pred?: (obj: go.GraphObject) => boolean optional
  • coll?: Set optional

Returns

Iterable

public findObjectsIn(r: Rect, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean, partialInclusion?: boolean, coll?: List): Iterable

Returns a collection of all GraphObjects that are inside or that intersect a given Rect in document coordinates.

Parameters

  • r: Rect

    A Rect in document coordinates.

  • navig?: (obj: go.GraphObject) => go.GraphObject optional

    A function taking a GraphObject and returning a GraphObject, defaulting to the identity. If this function returns null, the given GraphObject will not be included in the results.

  • pred?: (obj: go.GraphObject) => boolean optional

    A function taking the GraphObject returned by navig and returning true if that object should be returned, defaulting to a predicate that always returns true.

  • partialInclusion?: boolean optional

    Whether an object can match if it merely intersects the rectangular area (true) or if it must be entirely inside the rectangular area (false). The default value is false.

  • coll?: List optional

    An optional collection (List or Set) to add the results to.

Returns

Iterable

public findObjectsIn(r: Rect, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean, partialInclusion?: boolean, coll?: Set): Iterable

Parameters

  • r: Rect
  • navig?: (obj: go.GraphObject) => go.GraphObject optional
  • pred?: (obj: go.GraphObject) => boolean optional
  • partialInclusion?: boolean optional
  • coll?: Set optional

Returns

Iterable

public findObjectsNear(p: Point, dist: number, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean, partialInclusion?: boolean, coll?: List): Iterable

Returns a collection of all GraphObjects that are within a certain distance of a given point in document coordinates.

Parameters

  • p: Point

    A Point in document coordinates.

  • dist: number

    The distance from the point.

  • navig?: (obj: go.GraphObject) => go.GraphObject optional

    A function taking a GraphObject and returning a GraphObject, defaulting to the identity. If this function returns null, the given GraphObject will not be included in the results.

  • pred?: (obj: go.GraphObject) => boolean optional

    A function taking the GraphObject returned by navig and returning true if that object should be returned, defaulting to a predicate that always returns true.

  • partialInclusion?: boolean optional

    Whether an object can match if it merely intersects the circular area (true) or if it must be entirely inside the circular area (false). The default value is true. The default is true.

  • coll?: List optional

    An optional collection (List or Set) to add the results to.

Returns

Iterable

public findObjectsNear(p: Point, dist: number, navig?: (obj: go.GraphObject) => go.GraphObject, pred?: (obj: go.GraphObject) => boolean, partialInclusion?: boolean, coll?: Set): Iterable

Parameters

  • p: Point
  • dist: number
  • navig?: (obj: go.GraphObject) => go.GraphObject optional
  • pred?: (obj: go.GraphObject) => boolean optional
  • partialInclusion?: boolean optional
  • coll?: Set optional

Returns

Iterable

public findPartAt(p: Point, selectable: boolean): Part

This convenience function finds the front-most Part that is at a given point and that might be selectable.

Parameters

  • p: Point

    a Point in document coordinates.

  • selectable: boolean

    Whether to only consider parts that are Part#selectable.

Returns

Part

public findPartForData(data: Object): Part

Look for a Part, Node, Group, or Link corresponding to a Model's data object.

Parameters

  • data: Object

Returns

Part

public findPartForKey(key: any): Part

Look for a Part or Node or Group corresponding to a model's data object's unique key.

Parameters

  • key: any

    a string or number.

Returns

Part

public findTopLevelGroups(): Iterator

Returns an iterator of all Groups that are at top-level, in other words that are not themselves inside other Groups.

Returns

Iterator

public findTreeRoots(): Iterator

Returns an iterator of all top-level Nodes that have no tree parents.

Returns

Iterator

public focus(): any

Explicitly bring focus to the Diagram's canvas.

Returns

any

public layoutDiagram(invalidateAll?: boolean): any

Perform all invalid layouts.

Parameters

  • invalidateAll?: boolean optional

    If true, this will explicitly set Layout#isValidLayout to false on each Layout in the diagram.

Returns

any

public makeImage(properties?: Object): HTMLImageElement

Create an HTMLImageElement that contains a bitmap of the current Diagram.

Parameters

  • properties?: Object optional

    For details see the argument description of #makeImageData.

Returns

HTMLImageElement

public makeImageData(properties?: Object): string

Create a bitmap of the current Diagram encoded as a base64 string.

Parameters

  • properties?: Object optional

Returns

string

public maybeUpdate(): any

Returns

any

public rebuildParts(): any

Remove all of the Parts created from model data and then create them again.

Returns

any

public remove(part: Part): any

Removes a Part from its Layer, provided the Layer is in this Diagram.

Parameters

Returns

any

public removeChangedListener(listener: (e: go.ChangedEvent) => void): any

Unregister an event handler listener.

Parameters

  • listener: (e: go.ChangedEvent) => void

    a function that takes a ChangedEvent as its argument.

Returns

any

public removeDiagramListener(name: string, listener: (e: go.DiagramEvent) => void): any

Unregister a DiagramEvent handler.

Parameters

  • name: string

    the name is normally capitalized, but this method uses case-insensitive comparison.

  • listener: (e: go.DiagramEvent) => void

    a function that takes a DiagramEvent as its argument.

Returns

any

public removeLayer(layer: Layer): any

Removes the given layer from the list of layers.

Parameters

Returns

any

public requestUpdate(): any

Returns

any

public rollbackTransaction(): boolean

Rollback the current transaction, undoing any recorded changes.

Returns

boolean

public scroll(unit: string, dir: string, dist?: number): any

Scrolling function used by primarily by #commandHandler's CommandHandler#doKeyDown.

Parameters

  • unit: string

    A string representing the unit of the scroll operation. Can be 'pixel', 'line', or 'page'.

  • dir: string

    The direction of the scroll operation. Can be 'up', 'down', 'left', or 'right'.

  • dist?: number optional

    An optional distance multiplier, for multiple pixels, lines, or pages. Default is 1.

Returns

any

public scrollToRect(r: Rect): any

Modifies the #position to show a given Rect of the Diagram by centering the viewport on that Rect.

Parameters

Returns

any

public select(part: Part): any

Make the given object the only selected object.

Parameters

  • part: Part

    a GraphObject that is already in a layer of this Diagram. If the value is null, this does nothing.

Returns

any

public selectCollection(coll: Iterable): any

Select all of the Parts supplied in the given collection.

Parameters

  • coll: Iterable

    a List or Set of Parts to be selected.

Returns

any

public startTransaction(tname?: string): boolean

Begin a transaction, where the changes are held by a Transaction object in the UndoManager.

Parameters

  • tname?: string optional

    a descriptive name for the transaction.

Returns

boolean

public transformDocToView(p: Point): Point

Given a Point in document coordinates, return a new Point in viewport coordinates.

Parameters

Returns

Point

public transformViewToDoc(p: Point): Point

Given a point in viewport coordinates, return a new point in document coordinates.

Parameters

Returns

Point

public updateAllTargetBindings(): any

Update all of the data-bound properties of Nodes and Links in this diagram.

Returns

any

public zoomToFit(): any

Scales the Diagram to uniformly fit into the viewport.

Returns

any

public zoomToRect(r: Rect, scaling?: EnumValue): any

Modifies the #scale and #position of the Diagram so that the viewport displays a given document-coordinates rectangle.

Parameters

  • r: Rect

    rectangular bounds in document coordinates.

  • scaling?: EnumValue optional

    an optional value of either #Uniform (the default) or #UniformToFill.

Returns

any