Part class
This is the base class for all user-manipulated top-level objects. Because it inherits from Panel, it is automatically a visual container of other GraphObjects. Because it thus also inherits from GraphObject, it also has properties such as GraphObject#actualBounds, GraphObject#contextMenu, and GraphObject#visible.
If you just want an object that users can select and manipulate, you can create an instance of this class.
If you want an object that also supports being connected by links to other objects, use the Node class, which inherits from Part. Create those connections by using instances of the Link class.
If you want a node that logically contains a subgraph of nodes and links, use the Group class, which inherits from Node.
If you want an object that decorates another Part, without having to modify that Part, use the Adornment class. Adornments do not support linking or grouping or being selected.
You can construct a Part, add GraphObjects to it programmatically, and then add the part to a diagram by calling Diagram#add. However it is commonplace to add data to a model by setting its Model#nodeDataArray or calling Model#addNodeData, or for Links, setting the GraphLinksModel#linkDataArray or calling GraphLinksModel#addLinkData. Such actions will cause a diagram that is displaying the model to copy a template, which is a Part that may have data Bindings, and add the new part to the diagram. The Panel#data property will refer to that data object in the model.
Some examples of adding Parts to a Diagram:
// A simple Part template
myDiagram.nodeTemplate =
new go.Part("Horizontal")
.add(new go.Shape("Circle", { width: 20, height: 20 }))
.add(new go.TextBlock("Hello World"))
// Node templates can be either Nodes, or simple Parts
// (But not Groups, Adornments, or Links)
// Adds copies of the nodeTemplate bound to the specified node data:
myDiagram.model.nodeDataArray =
[
{ key: "Alpha" },
{ key: "Beta" }
];
// Adds one copy of the nodeTemplate bound to the given node data:
myDiagram.model.addNodeData( { key: "Gamma" } );
See the Introduction on using Models for examples and more information.
Layers and Z-ordering
Parts added to a Diagram exist in one of the Diagram's Layers. You can specify which layer the part should be in by setting #layerName. Parts cannot be nested in the visual tree -- they cannot be added to other Parts of Panels.
Parts can be individually z-ordered within a layer by setting #zOrder. Parts within the same layer that have a higher zOrder number will be drawn above parts with a lower number.
Size and Position
The size and position of a part are given by its GraphObject#actualBounds. The size is determined by the GraphObjects that are elements inside this part. You can change the position by setting GraphObject#position or Part#location.
The "location" of a part is commonly the same as its "position". The "position" is always the point that is at the top-left corner of the area occupied by the part. But the "location" may be different from the "position" if you want to think of the part as being "at" a different spot in the part. For example, you might want the "location" to be at the center of a Picture that has a TextBlock title of arbitrary size. In this case you would set the #locationSpot to be Spot.Center and the #locationObjectName to be the name of the Picture element in your Part.
A part may be selected or de-selected by setting its #isSelected property. This may also happen due to a call to Diagram#select or other operations that change the selection. The user may change this property as part of the operation of the ClickSelectingTool, due to the user's mouse click, if the part is #selectable.
Ability Properties (Permissions)
There are many properties named "...able", that control what operations the user may perform on this part. These properties correspond to the similarly named properties on Diagram and Layer that govern the behavior for all parts in all layers or for all parts in the given layer. For example, the Part#copyable property corresponds to the properties Diagram#allowCopy and Layer#allowCopy.
For each of these "ability" properties there is a corresponding "can..." predicate. For example, the Part#canCopy predicate is false if any of the three previously named properties is false. Commands and tools will normally call these predicates rather than just looking at Part properties.
For more discussion about permissions, please read: Permissions.
As previously mentioned, each Diagram supports the notion of selected parts. One way of displaying that a part is selected is by modifying the part. You can set the #selectionChanged property to be a function that is called when the value of #isSelected has changed; it is passed the Part as the first argument. The function can modify the color of one or more GraphObjects in the visual tree of that Part. Or perhaps it could toggle the GraphObject#visible property of an object that is normally hidden when the part is not selected.
The Part class also supports showing separate visual objects for a part when it gets selected. These visuals are typically used to show that the part is selected ("selection handles") or are used to allow the user to manipulate or modify the part with a tool ("tool handles"). These handles are instances of Adornments. The #updateAdornments method is responsible for showing or hiding adornments, normally depending on whether the part is selected.
When the #selectionAdorned property is true, a selected part automatically gets an Adornment created for it. By default the selection adornment is just a simple blue box around the Part, and a blue shape following the route of a selected Link. However you can set the #selectionAdornmentTemplate to an arbitrarily complex Adornment. This way it can show more information or buttons for executing various commands when the user selects a Part.
Tool handles are shown for those mode-less mouse-down tools that need it. The process of updating adornments for a part will call Tool#updateAdornments on each tool in ToolManager#mouseDownTools. Most tools might not need special tool handles. But, for example, ResizingTool naturally will want to create an adornment with eight resize handles positioned at the corners and at the middles of the sides of the selected node's visual element, if the node has its #canResize function returning true.
One may not always want the whole Part to get the selection handle or all tool handles. Sometimes one wants to emphasize selection by highlighting a particular element within the part's visual tree. This can be achieved by setting the #selectionObjectName property, and making sure the desired element has the same GraphObject#name property value.
For more discussion about selection, see Selection.
Similarly the #resizeObjectName and #rotateObjectName properties direct the corresponding ResizingTool and RotatingTool to operate on the particular GraphObject in the Part's visual tree with the given name. That includes both providing tool handles and actually modifying properties on that object.
Parts are not resizable or rotatable by default: you need to set #resizable and/or #rotatable to true.
For more discussion about tools, see Tools.
A Part may be positioned (or a Link may be routed) by a Layout. This will happen automatically if Diagram#layout or Group#layout are set. The default Diagram#layout will position any nodes that were not given explicit positions or location.
If you set #isLayoutPositioned to false, this part will not participate in any of the standard layouts, so it will not be moved by a layout or affect other parts in a layout. In order for the part to get a #location or position you will need to supply it explicitly.
As parts are added to or removed from a diagram, the Layout responsible for positioning the part is invalidated.
This will cause the layout to be performed again in the near future, at the end of the transaction.
This automatic layout invalidation also occurs as parts change their visibility (GraphObject#visible)
or their size (GraphObject#actualBounds).
If you do want there to be a Diagram#layout but you do not want an automatic layout to happen
after removing parts (for example), you can set #layoutConditions not to include the Part.LayoutRemoved flag.
In this particular case, you could set #layoutConditions to:
go.Part.LayoutStandard & ~go.Part.LayoutRemoved.
It may also reasonable for your application to set it to Part.LayoutNone.
Do not forget to consider applying the same conditions to links as well as to nodes and groups.
If you want to save the locations/positions of the parts in a diagram, it is commonplace to data bind the #location to a property on your node data with a TwoWay Binding (call Binding#makeTwoWay). For example:
new go.Part("Horizontal")
.bind(new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify))
// ...
Then as the nodes are moved, whether manually by the user or automatically by a Layout, the model data is automatically updated with the location.
For more discussion about related topics, see Selection, Tools, and Permissions.
Parts that are templates should have no relationships with other Parts. Only real Parts that are in a Diagram can belong to Groups or have any Adornments. Only real Nodes in a Diagram can be connected with Links.
- Implemented types
- Implementers
- Available extensions
- Annotations
-
- @JS()
- @staticInterop
Constructors
Properties
- hashCode → int
-
The hash code for this object.
no setterinherited
- runtimeType → Type
-
A representation of the runtime type of the object.
no setterinherited
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 Properties
- layoutAdded ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Part is added to a Diagram or Group, it invalidates the Layout responsible for the Part.
getter/setter pair
- layoutGroupLayout ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Group has been laid out, it invalidates the Layout responsible for that Group;
this flag is ignored for Parts that are not Groups.
getter/setter pair
- layoutHidden ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Part's GraphObject#visible becomes false, it invalidates the Layout responsible for the Part.
getter/setter pair
- layoutNodeReplaced ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Node or simple Part's #category changes, it invalidates the Layout responsible for the Part;
this flag is ignored for Parts that are Links.
getter/setter pair
- layoutNodeSized ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Node or simple Part's GraphObject#actualBounds changes size, it invalidates the Layout responsible for the Part;
this flag is ignored for Parts that are Links.
getter/setter pair
- layoutNone ↔ num
-
This value may be used as the value of the Part#layoutConditions property to indicate that
no operation on this Part causes invalidation of the Layout responsible for this Part.
getter/setter pair
- layoutRemoved ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Part is removed from a Diagram or Group, it invalidates the Layout responsible for the Part.
getter/setter pair
- layoutShown ↔ num
-
This flag may be combined with other "Layout" flags as the value of the Part#layoutConditions property to indicate that
when a Part's GraphObject#visible becomes true, it invalidates the Layout responsible for the Part.
getter/setter pair
- layoutStandard ↔ num
-
This is the default value for the Part#layoutConditions property, basically a combination of all of the conditions:
the Layout responsible for the Part is invalidated when the Part is added or removed or replaced
from the Diagram or Group, or when it changes visibility or size, or when a Group's layout has been performed.
getter/setter pair