mxVertexHandler

function mxVertexHandler( state )

Constructs an event handler that allows to resize vertices and groups.

Parameters

mxVertexHandler.prototype.init = function()

Initializes the shapes required for this vertex handler.

mxVertexHandler.prototype.getSelectionBounds = function( state )

Returns the mxRectangle that defines the bounds of the selection border.

mxVertexHandler.prototype.createSelectionShape = function( bounds )

Creates the shape used to draw the selection border.

mxVertexHandler.prototype.getSelectionColor = function()

Returns mxConstants.VERTEX_SELECTION_COLOR.

mxVertexHandler.prototype.getSelectionStrokeWidth = function()

Returns mxConstants.VERTEX_SELECTION_STROKEWIDTH.

mxVertexHandler.prototype.isSelectionDashed = function()

Returns <mxConstants.VERTEX_SELECTION_DASHED>.

mxVertexHandler.prototype.createSizer = function( cursor, index, size, fillColor )

Creates a sizer handle for the specified cursor and index and returns the new mxRectangleShape that represents the handle.

mxVertexHandler.prototype.isSizerVisible = function( index )

Returns true if the sizer for the given index is visible.  This returns true for all given indices.

mxVertexHandler.prototype.createSizerShape = function( bounds, index, fillColor )

Creates the shape used for the sizer handle for the specified bounds and index.

Helper method to create an mxRectangle around the given centerpoint with a width and height of 2*s or 6, if no s is given.

mxVertexHandler.prototype.getHandleForEvent = function( me )

Returns the index of the handle for the given event.  This returns the index of the sizer from where the event originated or <mxEvent.LABEL_INDEX>.

mxVertexHandler.prototype.mouseDown = function( sender, me )

Handles the event if a handle has been clicked.  By consuming the event all subsequent events of the gesture are redirected to this handler.

mxVertexHandler.prototype.start = function( x, y, index )

Starts the handling of the mouse gesture.

mxVertexHandler.prototype.hideSizers = function()

Hides all sizers except.

Starts the handling of the mouse gesture.

mxVertexHandler.prototype.checkTolerance = function( me )

Checks if the coordinates for the given event are within the mxGraph.tolerance.  If the event is a mouse event then the tolerance is ignored.

mxVertexHandler.prototype.mouseMove = function( sender, me )

Handles the event by updating the preview.

mxVertexHandler.prototype.mouseUp = function( sender, me )

Handles the event by applying the changes to the geometry.

mxVertexHandler.prototype.rotateCell = function( cell, delta )

Rotates the given cell to the given rotation.

mxVertexHandler.prototype.reset = function()

Resets the state of this handler.

mxVertexHandler.prototype.resizeCell = function( cell, dx, dy, index, gridEnabled )

Uses the given vector to change the bounds of the given cell in the graph using mxGraph.resizeCell.

mxVertexHandler.prototype.moveChildren = function( cell, dx, dy )

Moves the children of the given cell by the given vector.

mxVertexHandler.prototype.union = function( bounds, dx, dy, index, gridEnabled, scale, tr )

Returns the union of the given bounds and location for the specified handle index.

To override this to limit the size of vertex via a minWidth/-Height style, the following code can be used.

var vertexHandlerUnion = mxVertexHandler.prototype.union;
mxVertexHandler.prototype.union = function(bounds, dx, dy, index, gridEnabled, scale, tr)
{
  var result = vertexHandlerUnion.apply(this, arguments);

  result.width = Math.max(result.width, mxUtils.getNumber(this.state.style, 'minWidth', 0));
  result.height = Math.max(result.height, mxUtils.getNumber(this.state.style, 'minHeight', 0));

  return result;
};

The minWidth/-Height style can then be used as follows

graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30, 'minWidth=100;minHeight=100;');

To override this to update the height for a wrapped text if the width of a vertex is changed, the following can be used.

var mxVertexHandlerUnion = mxVertexHandler.prototype.union;
mxVertexHandler.prototype.union = function(bounds, dx, dy, index, gridEnabled, scale, tr)
{
  var result = mxVertexHandlerUnion.apply(this, arguments);
  var s = this.state;

  if (this.graph.isHtmlLabel(s.cell) && (index == 3 || index == 4) &&
      s.text != null && s.style[mxConstants.STYLE_WHITE_SPACE] == 'wrap')
  {
    var label = this.graph.getLabel(s.cell);
    var fontSize = mxUtils.getNumber(s.style, mxConstants.STYLE_FONTSIZE, mxConstants.DEFAULT_FONTSIZE);
    var ww = result.width / s.view.scale - s.text.spacingRight - s.text.spacingLeft

    result.height = mxUtils.getSizeForString(label, fontSize, s.style[mxConstants.STYLE_FONTFAMILY], ww).height;
  }

  return result;
};

mxVertexHandler.prototype.redraw = function()

Redraws the handles and the preview.

mxVertexHandler.prototype.redrawHandles = function()

Redraws the handles.  To hide certain handles the following code can be used.

mxVertexHandler.prototype.redrawHandles = function()
{
  mxVertexHandlerRedrawHandles.apply(this, arguments);

  if (this.sizers != null && this.sizers.length > 7)
  {
    this.sizers[1].node.style.display = 'none';
    this.sizers[6].node.style.display = 'none';
  }
};

mxVertexHandler.prototype.drawPreview = function()

Redraws the preview.

mxVertexHandler.prototype.destroy = function()

Destroys the handler and all its resources and DOM nodes.