documentationfor yFiles for HTML 2.6

Editing Graphs

A major feature of yFiles for HTML is its comprehensive support for editing graphs interactively. This is encapsulated in GraphEditorInputMode, a highly-customizable input mode. On its own it provides an editing experience similar to conventional graph editing applications, but it can also be configured to achieve almost any combination of desired interactions. For most use cases you probably want GraphEditorInputMode as the main input mode for your application.

Setting GraphEditorInputMode as main input mode
graphComponent.inputMode = new GraphEditorInputMode()

The benefits here are that GraphEditorInputMode is

  • scalable: It is possible to add new interactive functionality (in the form of other input modes) to GraphEditorInputMode.
  • flexible: Everything can be enabled or disabled, thus adjusting the default behavior to your needs.

GraphEditorInputMode supports creating and removing graph elements. Items can be moved and resized. Furthermore, support for click handling, selection, and context menus is provided. An overview of those features can be found in Supported User Interactions.

Most functionality is delegated to a wide array of child input modes. Both GraphEditorInputMode and its child input modes offer a number of ways to customize certain aspects of the child input modes, which are discussed briefly in Supported User Interactions and in detail in Customizing User Interaction.