toolbar
Description
Optional. An array of icon objects which sets a toolbar with buttons for items
Usage
toolbar?: [
{
id: string,
content: string,
check?: function,
css?: function,
tooltip?: string
},
{...} // other icon objects
];
Parameters
The toolbar array includes a set of icon objects. Each icon object can have the following parameters:
id
- (required) the id of the iconcontent
- (required) the content of the icon. It can contain an HTML element with the name of the icon classcheck
- (optional) checks whether the icon should be applied to the item. The function takes an item object and returns true, if the icon will be rendered for this itemcss
- (optional) the function which returns the name(s) of CSS class(es) that should be applied to the itemtooltip
- (optional) a tooltip which appears on hovering over the icon
Example
const diagram = new dhx.Diagram("diagram_container", {
type: "org",
select: true,
margin: {
y: 65
},
toolbar: [{
id: "download",
content: "<i className='dxi dxi-download'></i>",
tooltip: "Download",
},
{
id: "info",
content: "<i className='dxi dxi-information-outline'></i>",
tooltip: "Info",
}]
});
Change log:
- The tooltip parameter is added in v5.0
Related articles:
Related sample: Diagram. Configuration. Per-shape toolbar