Picture class

A Picture is a GraphObject that shows an image, video-frame, or Canvas element.

You can specify what to show by either setting the #source URL property to a URL string or the #element property to an HTMLImageElement, HTMLCanvasElement, or HTMLVideoElement.

If a #source URL is set, the Picture will automatically create a corresponding HTMLImageElement and retain a reference to it in memory. If multiple Pictures specify the same #source URL then they will all refer to the same HTMLImageElement.

Some created Pictures:

var $ = go.GraphObject.make;  // for conciseness in defining GraphObjects

// A picture with the source set to "example.png". It will show a gray area until the image is loaded:
$(go.Picture, { source: "example.png", background: "gray", width: 50, height: 50 })
// Alternatively:
$(go.Picture, "example.png", { background: "gray", width: 50, height: 50 })

If an element is not completely loaded during Diagram initialization, a redraw may occur, and if an image's size is not known before loading, the containing Part of this Picture may be resized, causing side effects such as layouts. This can be avoided by knowing the size of the image beforehand, and setting the Picture's GraphObject#desiredSize.

With some images (notably sprite sheets) only a portion of the image is expected to be drawn. The #sourceRect property allows the programmer to specify a rectangular area of the source image that the Picture should display.

The #imageStretch property allows an image to be resized inside of its bounding box. This property does not change the size of the Picture element, it only resizes or re-scales the image to fit (or not) in its bounds.

For examples of sizing and #imageStretch, see the Introduction page on Pictures.

The #errorFunction property allows one to set a function to call when a source fails to load. This is useful in instances where images cannot be guaranteed to work, such as with user specified input. The error function can set the #source to a known good value, but care should be taken to avoid error infinite loops when doing so.

Implemented types

• GraphObject

Available Extensions

• GraphObject$Typings
• Picture$Typings

Annotations

• @JS()
• @staticInterop

Constructors

Picture.$1()

factory

Picture.$2([dynamic init])

factory

Picture.$3([String? source, dynamic init])

factory

Properties

hashCode → int

The hash code for this object.

no setter, inherited

runtimeType → Type

A representation of the runtime type of the object.

no setter, inherited

Methods

noSuchMethod(Invocation invocation) → dynamic

Invoked when a nonexistent method or property is accessed.

inherited

toString() → String

A string representation of this object.

inherited

Operators

operator ==(Object other) → bool

The equality operator.

inherited

Static Methods

clearCache([String? url]) → void

(undocumented) This static function clears the cache of loaded images, or removes the cached image for a particular URL.