JavaScript/jQuery Diagram - propertiesPanel.tabs

Contains an array of tabs in the Properties panel.

Type:

Array<Object>

Default Value: undefined

commands

Lists commands in a tab.

Type:

Array<CustomCommand | Command>

Use the groups property to group commands in the tab. Note, if the groups property is specified, the commands property is not in effect.

A properties panel tab can contain default and custom commands. Handle the CustomCommand event to respond to a custom command click.

JavaScript
  • $(function() {
  • var diagram = $("#diagram").dxDiagram({
  • propertiesPanel: {
  • visibility: 'visible',
  • tabs: [{
  • title: "Page Properties",
  • commands: ["pageSize", "pageOrientation", {name: "sayHello", text: "Say Hello", icon: "blockquote"}]
  • }]
  • },
  • onCustomCommand: function(e) {
  • if (e.name == "sayHello")
  • alert("Hello!")
  • },
  • }).dxDiagram("instance");
  • });

groups[]

Contains an array of command groups in the tab.

Type:

Array<Object>

title

Specifies the tab's title.

Type:

String

Titles and tab headers are not displayed when there is only one tab in the Properties panel.