Class CellRenderer

Renders cells into a document object model. The is a global map of shape names, constructor pairs that is used in all instances. You can get a list of all available shape names using the following code.

In general the cell renderer is in charge of creating, redrawing and destroying the shape and label associated with a cell state, as well as some other graphical objects, namely controls and overlays. The shape hierarchy in the display (i.e. the hierarchy in which the DOM nodes appear in the document) does not reflect the cell hierarchy. The shapes are a (flat) sequence of shapes and labels inside the draw pane of the graph view, with some exceptions, namely the HTML labels being placed directly inside the graph container for certain browsers.

GlobalConfig.logger.show();
for (var i in mxCellRenderer.defaultShapes)
{
  GlobalConfig.logger.debug(i);
}

Constructors

constructor

new CellRenderer(): CellRenderer
Returns CellRenderer

Properties

antiAlias

antiAlias: boolean = true

Antialiasing option for new shapes.

Default

true.

defaultEdgeShape

defaultEdgeShape: typeof Shape = ConnectorShape

Defines the default shape for edges.

Default

ConnectorShape

defaultTextShape

defaultTextShape: typeof TextShape = TextShape

Defines the default shape for labels.

Default

TextShape.

defaultVertexShape

defaultVertexShape: typeof RectangleShape = RectangleShape

Defines the default shape for vertices.

Default

RectangleShape.

forceControlClickHandler

forceControlClickHandler: boolean = false

Specifies if the enabled state of the graph should be ignored in the control click handler (to allow folding in disabled graphs).

Default

false.

legacyControlPosition

legacyControlPosition: boolean = true

Specifies if the folding icon should ignore the horizontal orientation of a swimlane.

Default

true.

legacySpacing

legacySpacing: boolean = true

Specifies if spacing and label position should be ignored if overflow is fill or width.

Default

true for backwards compatibility.

minSvgStrokeWidth

minSvgStrokeWidth: number = 1

Minimum stroke width for SVG output.

`Static`defaultShapes

defaultShapes: {
[key: string]: typeof Shape;
} = {}

Static array that contains the globally registered shapes which are known to all instances of this class. For adding new shapes you should use the static CellRenderer#registerShape function.

Built-in shapes: arrow, rectangle, ellipse, rhombus, image, line, label, cylinder, swimlane, connector, actor and cloud.

Methods

checkPlaceholderStyles

checkPlaceholderStyles(state): boolean
Check if style properties supporting placeholders requires resolution.
Parameters
- state: CellState
Returns boolean
- Defined in view/cell/CellRenderer.ts:268

configureShape

configureShape(state): void
Configures the shape for the given cell state.
Parameters
- state: CellState
  for which the shape should be configured.
Returns void
- Defined in view/cell/CellRenderer.ts:232

createCellOverlays

createCellOverlays(state): void
Creates the actual shape for showing the overlay for the given cell state.
Parameters
- state: CellState
  for which the overlay should be created.
Returns void
- Defined in view/cell/CellRenderer.ts:478

createControl

createControl(state): void
Creates the control for the given cell state.
Parameters
- state: CellState
  for which the control should be created.
Returns void
- Defined in view/cell/CellRenderer.ts:566

createControlClickHandler

createControlClickHandler(state): ((evt: Event) => void)
Hook for creating the click handler for the folding icon.
Parameters
- state: CellState
  whose control click handler should be returned.
Returns ((evt: Event) => void)
- - (evt): void
  - Parameters
    - evt: Event
    Returns void
- Defined in view/cell/CellRenderer.ts:595

createIndicatorShape

createIndicatorShape(state): void
Creates the indicator shape for the given cell state.
Parameters
- state: CellState
  CellState for which the indicator shape should be created.
Returns void
- Defined in view/cell/CellRenderer.ts:200

createLabel

createLabel(state, value): void
Creates the label for the given cell state.
Parameters
- state: CellState
  for which the label should be created.
- value: string
Returns void
- Defined in view/cell/CellRenderer.ts:353

createShape

createShape(state): Shape
Creates and returns the shape for the given cell state.
Parameters
- state: CellState
  CellState for which the shape should be created.
Returns Shape
- Defined in view/cell/CellRenderer.ts:178

destroy

destroy(state): void
Destroys the shapes associated with the given cell state.
Parameters
- state: CellState
  for which the shapes should be destroyed.
Returns void
- Defined in view/cell/CellRenderer.ts:1481

doRedrawShape

doRedrawShape(state): void
Invokes redraw on the shape of the given state.
Parameters
- state: CellState
Returns void
- Defined in view/cell/CellRenderer.ts:1459

getControlBounds

getControlBounds(state, w, h): null | Rectangle
Returns the bounds to be used to draw the control (folding icon) of the given state.
Parameters
- state: CellState
- w: number
- h: number
Returns null | Rectangle
- Defined in view/cell/CellRenderer.ts:1178

getLabelBounds

getLabelBounds(state): Rectangle
Returns the bounds to be used to draw the label of the given state.
Parameters
- state: CellState
  whose label bounds should be returned.
Returns Rectangle
- Defined in view/cell/CellRenderer.ts:954

getLabelValue

getLabelValue(state): null | string
Returns the value to be used for the label.
Parameters
- state: CellState
  for which the label should be created.
Returns null | string
- Defined in view/cell/CellRenderer.ts:343

getShape

getShape(name): null | typeof Shape
Returns the shape for the given name from defaultShapes.
Parameters
- name: null | string
Returns null | typeof Shape
- Defined in view/cell/CellRenderer.ts:209

getShapeConstructor

getShapeConstructor(state): typeof Shape
Returns the constructor to be used for creating the shape.
Parameters
- state: CellState
Returns typeof Shape
- Defined in view/cell/CellRenderer.ts:216

getShapesForState

getShapesForState(state): [null | Shape, null | TextShape, null | Shape]
Returns the Shapes for the given cell state in the order in which they should appear in the DOM.
Parameters
- state: CellState
  whose shapes should be returned.
Returns [null | Shape, null | TextShape, null | Shape]
- Defined in view/cell/CellRenderer.ts:1321

getTextScale

getTextScale(state): number
Returns the scaling used for the label of the given state
Parameters
- state: CellState
  whose label scale should be returned.
Returns number
- Defined in view/cell/CellRenderer.ts:945

initControl

initControl(state, control, handleEvents, clickHandler): null | Element
Initializes the given control and returns the corresponding DOM node.
Parameters
- state: CellState
  for which the control should be initialized.
- control: Shape
  Shape to be initialized.
- handleEvents: boolean
  Boolean indicating if mousedown and mousemove should fire events via the graph.
- clickHandler: EventListener
  Optional function to implement clicks on the control.
Returns null | Element
- Defined in view/cell/CellRenderer.ts:615

initializeLabel

initializeLabel(state, shape): void
Initiailzes the label with a suitable container.
Parameters
- state: CellState
  whose label should be initialized.
- shape: Shape
Returns void
- Defined in view/cell/CellRenderer.ts:464

initializeOverlay

initializeOverlay(state, overlay): void
Initializes the given overlay.
Parameters
- state: CellState
  for which the overlay should be created.
- overlay: ImageShape
  ImageShape that represents the overlay.
Returns void
- Defined in view/cell/CellRenderer.ts:518

initializeShape

initializeShape(state): void
Initializes the shape in the given state by calling its init method with the correct container after configuring it using configureShape.
Parameters
- state: CellState
  for which the shape should be initialized.
Returns void
- Defined in view/cell/CellRenderer.ts:165

insertStateAfter

insertStateAfter(state, node, htmlNode): (null | HTMLElement | SVGElement)[]
Inserts the given array of Shapes after the given nodes in the DOM.
Parameters
- state: CellState
- node: null | HTMLElement | SVGElement
  Node in after which the shapes should be inserted.
- htmlNode: null | HTMLElement | SVGElement
  Node in the graph container after which the shapes should be inserted that will not go into the (eg. HTML labels without foreignObjects).
Returns (null | HTMLElement | SVGElement)[]
- Defined in view/cell/CellRenderer.ts:1243

installCellOverlayListeners

installCellOverlayListeners(state, overlay, shape): void
Installs the listeners for the given , and Shape that represents the overlay.
Parameters
- state: CellState
- overlay: CellOverlay
- shape: Shape
Returns void
- Defined in view/cell/CellRenderer.ts:526

installListeners

installListeners(state): void
Installs the event listeners for the given cell state.
Parameters
- state: CellState
  for which the event listeners should be isntalled.
Returns void
- Defined in view/cell/CellRenderer.ts:728

isLabelEvent

isLabelEvent(state, evt): boolean
Returns true if the event is for the label of the given state. This implementation always returns true.
Parameters
- state: CellState
  whose label fired the event.
- evt: MouseEvent
  Mouse event which was fired.
Returns boolean
- Defined in view/cell/CellRenderer.ts:719

isShapeEvent

isShapeEvent(state, evt): boolean
Returns true if the event is for the shape of the given state. This implementation always returns true.
Parameters
- state: CellState
  whose shape fired the event.
- evt: MouseEvent
  Mouse event which was fired.
Returns boolean
- Defined in view/cell/CellRenderer.ts:708

isShapeInvalid

isShapeInvalid(state, shape): boolean
Returns true if the given shape must be repainted.
Parameters
- state: CellState
- shape: Shape
Returns boolean
- Defined in view/cell/CellRenderer.ts:1466

isTextShapeInvalid

isTextShapeInvalid(state, shape): boolean
Returns true if the style for the text shape has changed.
Parameters
- state: CellState
  whose label should be checked.
- shape: TextShape
  Text shape to be checked.
Returns boolean
- Defined in view/cell/CellRenderer.ts:888

postConfigureShape

postConfigureShape(state): void
Replaces any reserved words used for attributes, eg. inherit, indicated or swimlane for colors in the shape for the given state. This implementation resolves these keywords on the fill, stroke and gradient color keys.
Parameters
- state: CellState
Returns void
- Defined in view/cell/CellRenderer.ts:255

redraw

redraw(state, force?, rendering?): void
Updates the bounds or points and scale of the shapes for the given cell state. This is called in mxGraphView.validatePoints as the last step of updating all cells.
Parameters
- state: CellState
  for which the shapes should be updated.
- force: boolean = false
  Optional boolean that specifies if the cell should be reconfiured and redrawn without any additional checks.
- rendering: boolean = true
  Optional boolean that specifies if the cell should actually be drawn into the DOM. If this is false then redraw and/or reconfigure will not be called on the shape.
Returns void
- Defined in view/cell/CellRenderer.ts:1337

redrawCellOverlays

redrawCellOverlays(state, forced?): void
Redraws the overlays for the given cell state.
Parameters
- state: CellState
  whose overlays should be redrawn.
- forced: boolean = false
Returns void
- Defined in view/cell/CellRenderer.ts:1097

redrawControl

redrawControl(state, forced?): void
Redraws the control for the given cell state.
Parameters
- state: CellState
  whose control should be redrawn.
- forced: boolean = false
Returns void
- Defined in view/cell/CellRenderer.ts:1148

redrawLabel

redrawLabel(state, forced): void
Redraws the label for the given cell state.
Parameters
- state: CellState
  whose label should be redrawn.
- forced: boolean
Returns void
- Defined in view/cell/CellRenderer.ts:805

redrawLabelShape

redrawLabelShape(shape): void
Called to invoked redraw on the given text shape.
Parameters
- shape: TextShape
  Text shape to be redrawn.
Returns void
- Defined in view/cell/CellRenderer.ts:936

redrawShape

redrawShape(state, force?, rendering?): boolean
Redraws the shape for the given cell state.
Parameters
- state: CellState
  whose label should be redrawn.
- force: boolean = false
- rendering: boolean = true
Returns boolean
- Defined in view/cell/CellRenderer.ts:1352

resolveColor

resolveColor(state, field, key): void
Resolves special keywords 'inherit', 'indicated' and 'swimlane' and sets the respective color on the shape.
Parameters
- state: CellState
- field: string
- key: string
Returns void
- Defined in view/cell/CellRenderer.ts:282

rotateLabelBounds

rotateLabelBounds(state, bounds): void
Adds the shape rotation to the given label bounds and applies the alignment and offsets.
Parameters
- state: CellState
  whose label bounds should be rotated.
- bounds: Rectangle
  Rectangle the rectangle to be rotated.
Returns void
- Defined in view/cell/CellRenderer.ts:1029

`Static`registerShape

registerShape(key, shape): void
Registers the given constructor under the specified key in this instance of the renderer.
Parameters
- key: string
  the shape name.
- shape: typeof Shape
  constructor of the Shape subclass.
Returns void
Example
```
CellRenderer.registerShape(Constants.SHAPE_RECTANGLE, RectangleShape);
```
- Defined in view/cell/CellRenderer.ts:155

Class CellRenderer

Index

Constructors

Properties

Methods

Constructors

constructor

Returns CellRenderer

Properties

antiAlias

Default

defaultEdgeShape

Default

defaultTextShape

Default

defaultVertexShape

Default

forceControlClickHandler

Default

legacyControlPosition

Default

legacySpacing

Default

minSvgStrokeWidth

StaticdefaultShapes

Methods

checkPlaceholderStyles

Parameters

Returns boolean

configureShape

Parameters

Returns void

createCellOverlays

Parameters

Returns void

createControl

Parameters

Returns void

createControlClickHandler

Parameters

Returns ((evt: Event) => void)

Parameters

Returns void

createIndicatorShape

Parameters

Returns void

createLabel

Parameters

Returns void

createShape

Parameters

Returns Shape

destroy

Parameters

Returns void

doRedrawShape

Parameters

Returns void

getControlBounds

Parameters

Returns null | Rectangle

getLabelBounds

Parameters

Returns Rectangle

getLabelValue

Parameters

Returns null | string

getShape

Parameters

Returns null | typeof Shape

getShapeConstructor

Parameters

Returns typeof Shape

getShapesForState

Parameters

Returns [null | Shape, null | TextShape, null | Shape]

getTextScale

Parameters

Returns number

initControl

`Static`defaultShapes

`Static`registerShape