gapPreview

info

The property is available only in the default mode of the editor (type:"default")

Description

Optional. Specifies the space between the items rendered in the left panel

Usage

gapPreview?: string | number;

Default config

gapPreview: "6px 8px"
// sets 6px gap for the top and bottom sides and 8px gap for the right and left sides

Example

const editor = new dhx.DiagramEditor("editor_container", {
    gapPreview: 10
});

The value of the gapPreview property can be redefined for a separate shape via the gap attribute of the preview property of the shape object:

const defaults = {card: {
    preview: {
        scale: 0.72, 
        gap: 2
    }
}
 
const editor = new dhx.DiagramEditor("editor_container", {
    shapeSections: {
        "org chart shapes": ["card", "img-card"],
        "flowchart shapes": [true]
    },
    scalePreview: 0.65,
    defaults: defaults         
});

Related articles: Left Panel