Skip to main content

view

Description​

An object that configures Toolbar, Shapebar, and Editbar views of the Diagram Editor

Usage​

view: {
    toolbar?: boolean | object,
    shapebar?: boolean | object,
    editbar?: boolean | object
};

Parameters​

  • toolbar - (optional) allows you to show/hide Toolbar (if boolean) or configure its appearance (if object). Refer to the Toolbar API section for more information about configuring the toolbar
  • shapebar - (optional) allows you to show/hide Shapebar (if boolean) or configure its appearance (if object). Refer to the Shapebar API section for more information about configuring the shapebar
  • editbar - (optional) allows you to show/hide Editbar (if boolean) or configure its appearance (if object). Refer to the Editbar API section for more information about configuring the Editbar

Default config​

view: {
    toolbar: true,
    shapebar: true,
    editbar: true
}

Example​

const editor = new dhx.DiagramEditor("editor_container", {
    type: "default",
    view: {
        toolbar: {
            css: "toolbar_custom",
            data: ["file", "separator", "scale"]
        },
        shapebar: {
            width: 400
        },
        editbar: false
    }
    // other configurations 
});

Change log: Added in v6.0