@maxgraph/core
    Preparing search index...

    Class RubberBandHandler

    Event handler that selects rectangular regions.

    IMPORTANT: This is not built-into maxGraph i.e. this plugin is not in the maxGraph default plugins, see getDefaultPlugins.

    To enable rubberband selection in a graph, use the following code.

    const plugins = [
      ...getDefaultPlugins(), // or any other plugins you want
      RubberBandHandler,
    ];

    // Creates the graph with the custom plugins
    const graph = new Graph(container, undefined, plugins);

    IMPORTANT: the RubberBandHandler requires CSS styles in order to work properly. See the CSS rules in the css/common.css file provided within the npm package. They relate to the .mxRubberband class.

    Implements

    Index

    Constructors

    constructor

    Properties

    currentX currentY defaultOpacity destroyed div dragHandler dropHandler enabled fadeOut first forceRubberbandHandler gestureHandler graph height panHandler sharedDiv width x y pluginId

    Methods

    createShape execute isActive isEnabled isForceRubberbandEvent mouseDown mouseMove mouseUp onDestroy repaint reset setEnabled start update

    Constructors

    Properties

    currentX: number = 0

    Holds the value of the x argument in the last call to update.

    currentY: number = 0

    Holds the value of the y argument in the last call to update.

    defaultOpacity: number = 20

    Specifies the default opacity to be used for the rubberband div. Valid values are between 0 and 100.

    20
    destroyed: boolean = false
    div: null | HTMLElement = null

    Holds the DIV element which is currently visible.

    dragHandler: null | ((evt: MouseEvent) => void) = null
    dropHandler: null | ((evt: MouseEvent) => void) = null
    enabled: boolean = true

    Specifies if events are handled.

    true
    fadeOut: boolean = false

    Optional fade out effect.

    false
    first: null | Point = null
    forceRubberbandHandler: Function
    gestureHandler: Function
    graph: Graph
    height: number = 0
    panHandler: Function
    sharedDiv: null | HTMLElement = null

    Holds the DIV element which is used to display the rubberband.

    width: number = 0
    x: number = 0
    y: number = 0
    pluginId: string = 'RubberBandHandler'

    Methods

    • Resets the state of this handler and selects the current region for the given event.

      Parameters

      • evt: MouseEvent

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods