Skip to main content

lineConfig

Description

Optional. An object with default configuration for the newly added connector lines

info

The settings will be applied to the new connector lines which are added via the editor

Usage

lineConfig?: {
lineType?: "dash" | "line",
lineDirection?: "backArrow" | "forwardArrow",
arrowsHidden?: boolean,
lineGap?: number
};

Parameters

The lineConfig object contains the following parameters:

  • lineType - (optional) the default type of the new connector lines
  • lineDirection - (optional) the direction of the new connector lines
  • arrowsHidden - (optional) defines whether the arrows of the new connector lines should be hidden
  • lineGap - (optional) sets the distance to the right-angled bend of a connector line
note

The lineDirection, arrowsHidden, and lineGap parameters work only in the default mode of the editor (type: "default")

Default config

lineConfig: {
lineType:"line",
lineDirection: "forwardArrow",
arrowsHidden: false,
lineGap: 10
}

Example

const editor = new dhx.DiagramEditor("editor_container", {
type: "default",
lineConfig: {
lineType: "dash",
lineDirection: "backArrow",
arrowsHidden: true,
lineGap: 50
},
// other config parameters
});

The result of applying the lineGap property is shown in the image below:

IMAGE HERE

Change log:

  • The lineGap parameter is added in v5.0 (check the Migration article)
  • Added in v4.2

Related sample: Diagram editor. Setting the default line (connector) type. Try connecting shape A to shape B