Skip to main content

UICoreOptions

Base options for a renderer.

Extended by​

Type Parameters​

E​

E

O​

O extends UICoreDefaults

Properties​

canCollapseGroup()?​

optional canCollapseGroup: (group, currentSize) => boolean | ObjectData

Returns whether or not the given group can be collapsed

Parameters​

group​

Group

Group in question

currentSize​

Size

The group's current size.

Returns​

boolean | ObjectData

Either a boolean value indicating the operation may or may not proceed, or a set of values. In the case that a set of values are returned, the operation is approved, and the data returned is updated onto the group's dataset. This is useful when your UI wants to stored specific information related to the collapsed group.

canExpandGroup()?​

optional canExpandGroup: (group, currentSize) => boolean | ObjectData

Returns whether or not the given group can be expanded

Parameters​

group​

Group

Group in question

currentSize​

Size

The group's current (collapsed) size.

Returns​

boolean | ObjectData

Either a boolean value indicating the operation may or may not proceed, or a set of values. In the case that a set of values are returned, the operation is approved, and the data returned is updated onto the group's dataset. This is useful when your UI wants to stored specific information related to the expanded group.

defaultCollapsedGroupSize?​

optional defaultCollapsedGroupSize: Size

Optional default size for a collapsed group. Defaults to 200x150.

defaults?​

optional defaults: O

Optional default settings

edges?​

optional edges: UIEdgeOptions

Default options for edges - these will apply to all edge types in the UI.

getCollapsedGroupSize()?​

optional getCollapsedGroupSize: (group, currentSize) => Size

Optional function to determine the size of a collapsed group. This is given precedence over any default or per-type specification for a collapsed group's size.

Parameters​

group​

Group

The group that is being collapsed.

currentSize​

Size

Returns​

Size

The size for the collapsed group.

grid?​

optional grid: GridOptions

Options for imposing a grid onto the elements in the UI

id?​

optional id: string

Optional ID for the UI. Allows you to retrieve this UI from a model's getRenderer(id) method.

layout?​

optional layout: LayoutSpec

Defines the layout to use.

logicalPorts?​

optional logicalPorts: boolean

Defaults to false. When true, the UI treats the vertex's element as the element for the port if it cannot find a specific element for the port.

plugins?​

optional plugins: UIPluginSpec<any>[]

Optional list of plugins to attach to the UI.

relayoutOnEdgeConnect?​

optional relayoutOnEdgeConnect: boolean

When true, the UI will run a refresh of the underlying layout whenever a new edge is established. This defaults to false, but you might want to set this to true if you're using the Hierarchical or Hierarchy layouts, because it has a bearing on the way they paint. However, if your users are able to drag vertices around, you may not wish for the layout to move things that they have placed, which is why this defaults to false.

relayoutOnResize?​

optional relayoutOnResize: boolean

Whether or not to relayout the UI when an element's size changes as a result of content changes in its element. Defaults to false.

relayoutOnVertexRemove?​

optional relayoutOnVertexRemove: boolean

Whether or not to relayout the UI when a vertex is removed. Defaults to false. For some layouts, like the Hierarchy layout, you may wish to switch this on.

router()?​

optional router: (u) => Router<E>

Optional factory method to instantiate a router. This is only for certain advanced usages in which you wish to route all of the edges yourself. Most applications do not need to consider this.

Parameters​

u​

UICore<E>

Returns​

Router<E>

useModelForPositions?​

optional useModelForPositions: boolean

Defaults to true - we get positions for elements from our layout. In some use cases you may wish to use element positions retrieved from the DOM.

useModelForSizes?​

optional useModelForSizes: boolean

Defaults to false. When true, newly created nodes are sized according to values in their backing data, using the modelWidthAttribute and modelHeightAttribute as keys. NOTE: when this flag is set, VisuallyJs will write the size onto each element as it is created. Depending on your app, you may not need it to do this - if you know your node sizes are set via css, for instance, or you know the template rendering your vertices writes out the size in an element's style or an SVG element's width/height. If that is the case, you can set writeSizeToElements to be false, and you'll get a performance boost.

writeSizeToElements?​

optional writeSizeToElements: boolean

When useModelForSizes is true, VisuallyJs will write out the model size onto each element rendered. But if you know your node sizes are set via css, or you know the template rendering your vertices writes out the size in an element's style or an SVG element's width/height, you can instruct VisuallyJs not to bother writing out the size to the element itself, by setting this flag to true (the default is false). This can provide a performance boost.

zoomToFit?​

optional zoomToFit: boolean

If true, zoom the display so that the dataset is entirely visible after initialisation.

zoomToFitIfNecessary?​

optional zoomToFitIfNecessary: boolean

If true, zoom the display so that the dataset is entirely visible after initialisation, but only adjust the zoom level if the dataset is not already visible at the default zoom level.