DHTMLX Diagram 6.0

Released on May 16, 2024

Review of release on the blog

Breaking changes

The new update introduces significant changes in the structure and functionality of Diagram and Diagram Editor. Check the Migration article to keep in step with the latest version.

New functionality

• Restructuring of Diagram Editor: providing the ability to interact with its parts and manage their visibility with the view property that includes the following configurations:
  • Toolbar - a top part of Diagram Editor that helps users to control the editing process (see API overview)
  • Shapebar - (former Left panel) a part of Diagram Editor that renders previews of Diagram items (see API overview)
  • Editbar - (former Right panel) a part of Diagram Editor that allows users to edit Diagram items (see API overview). You can perform the following actions:
    • sets of predefined Basic controls and Complex controls
    • adjustable configuration of Basic controls and Complex controls depending on the provided conditions
    • dynamic management of the Editbar panel depending on the provided conditions (Example)
    • creation of custom controls (Example)
    • creation of HTML content (Example)
• Diagram Editor. The Copy manager API added
• Diagram Editor. The ability to show/hide Shapebar, Editbar and Toolbar
• Diagram Editor. The destructor() method is added
• Diagram Editor. The ability to hide the connection points
• Diagram Editor. The ability to hide the resize points
• Diagram Editor. The ability to hide the grid
• The upgrade of the Selection API with the ability of multiple selection
• The titles of lines are declared as separate objects defined as lineTitles with their own configuration properties
• Supporting new themes: Dark, Light High Contrast and Dark High Contrast (Example)
• Diagram Editor. The ability to customize the Shapebar items' color scheme by redefining the CSS variables and using the custom ones

Updates

• Diagram Editor. Locales are updated
• Diagram Editor. The Hotkeys list is extended
• Diagram Editor. The behavior of Shapebar items when they are pulled to the grid and their appearance are improved
• Diagram Editor. The callback function of zoomIn / zoomOut events is called with the step parameter
• Diagram Editor. The functionality of the magnetic configuration option is extended
• Diagram Editor. The move events of the Editor object are updated:
  afterGroupMove,
  afterItemCatch,
  afterItemMove,
  afterLineTitleMove,
  afterShapeMove,
  beforeGroupMove,
  beforeItemCatch,
  beforeItemMove,
  beforeLineTitleMove,
  beforeShapeMove,
  groupMoveEnd,
  itemMoveEnd,
  itemTarget,
  lineTitleMoveEnd,
  shapeMoveEnd
• The ability to work with line titles via the DataCollection API

Deprecated API

• Properties

  • The controls property of Diagram Editor is deprecated and no longer supported
  • The editMode property of Diagram Editor is deprecated and no longer supported
  • The gapPreview property of Diagram Editor is deprecated and no longer supported
  • The reservedWidth property of Diagram Editor is deprecated and no longer supported
  • The scalePreview property of Diagram Editor is deprecated and no longer supported
  • The shapeBarWidth property of Diagram Editor is deprecated and no longer supported
  • The shapeSections property of Diagram Editor is deprecated and no longer supported
  • The title property of Line data is deprecated and no longer supported

• Methods

  • The getId() method of the Selection object of Diagram is deprecated and no longer supported
  • The getSubId() method of the Selection object of Diagram is deprecated and no longer supported
  • The setViewMode() method of Diagram Editor is deprecated and no longer supported

• Events

  • The following events of Diagram Editor are deprecated and no longer supported, since there are no corresponding buttons in the toolbar: resetButton, applyButton, visibility, exportData, importData, autoLayout
  • The changeGridStep event of Diagram Editor is deprecated and no longer supported

DHTMLX Diagram 5.0

Released on September 7, 2022

Review of release on the blog

Breaking changes

The new release introduces some changes to the lineGap property. Check the Migration article to keep in step with the latest version.

New functionality

Diagram

• Radial algorithm of auto-placement of shapes:
  • the placemode parameter is added to the autoplacement property
  • the placemode parameter is added to the autoPlace() method
• The ability to set tooltips for toolbar icons:
  • the tooltip parameter of the icon object is added to the toolbar property

Diagram Editor

• Radial algorithm of auto-placement of shapes:
  • the placemode parameter is added to the autoplacement property
  • the Auto Layout button of Toolbar now provides two options for shapes' auto-placement: Orthogonal and Radial
• Snap lines for arrangement of shapes in the grid area with greater precision
• The ability to configure snap lines via the new magnetic property
• The ability to copy and paste styles of an item(s) via Alt (Option) + Ctrl (Cmd) + С => Alt (Option) + Ctrl (Cmd) + V (see the example)
• The ability to align and distribute multiple items
• Now tooltips will appear when you hover over controls in the personal toolbar of items
• Extended list of locale options for localization of tooltips in the per-item toolbar
• The ability to set tooltips for custom toolbar icons:
  • the tooltip parameter of the icon object is added to the shapeToolbar property
• Improved design of Grid area. Now the distance between points in the grid area depends on the value of the grid step

Fixes in version 5.0

• Fix the issue which caused a loading icon not to disappear from the right panel of Editor after loading a file

Fixes in version 5.0.1

• Diagram Editor. Fix the issue which caused lines not always being drawn in their places if data was exported and then loaded again
  • Now it is possible to define the coordinates for lines in the default mode (new points property of the line object)
• Diagram Editor. Fix the issue with dragging of shapes in the grid after changing the zoom level
• Fix the error thrown after clicking on the "Auto layout" button in the absence of shapes
• Fix the issue with display of default settings after creation of lines via the editor
• Fix the issue with scale of Diagram/Diagram Editor appeared when auto-placing shapes in the "radial" mode

Fixes in version 5.0.2

• Diagram Editor. Fix the issue with custom points not moving during a multi select move
• Diagram Editor. Fix the impossibility to link a shape to itself
• Fix the problem with exporting a default diagram without exportStyles
• Fix the issue with the promiz.js library that caused an error with the setImmediate() method definition on importing the sources
• Fix path formation of the URL in the Export object
• Types for export are added

Fixes in version 5.0.3

• Fix the issue when calling of the autoPlace() method after data parsing caused an error

DHTMLX Diagram 4.2

Released on March 3, 2022

New functionality

• Touch support
• The ability to specify the default setting for lines via the lineConfig property of Diagram
• The ability to specify the default settings for new lines created in the editor via the lineConfig property of Diagram Editor
• The ability to add default sets of org shapes, groups, swimlanes in the necessary order when configuring sections in the left panel of the editor

Updates

• The defaultLinkType property of Diagram is deprecated. Check the Migration article
• The shapeSections property of Diagram Editor is updated. Check the Migration article
• Now it is possible to define the default configurations not only for shapes of the particular types but also for lines:
  • the defaults property of Diagram is updated
  • the defaults property of Diagram Editor is updated
• The documentation for Modes of connecting shapes has been updated

DHTMLX Diagram 4.1

Released on December 7, 2021

New functionality

• The ability to add partner shapes in the org chart mode
• The ability to add assistant shapes in the org chart mode
• The ability to add titles to lines in the default mode
• The ability to drag and drop shapes from one parent to another in Editor in org chart and mind map modes. The shapes are dragged with their children items
• The ability to style target items in Editor in org chart and mindmap modes

API

• New events of the Diagram object: emptyAreaDblClick, emptyAreaMouseDown, lineTitleClick, lineTitleDblClick, lineTitleMouseDown
• New Shape properties specific for the org chart mode: assistant, partner, catchItem, giveItem
• New Shape properties specific for the mindmap mode: catchItem, giveItem
• New Line properties specific for the default mode: title
• New methods of the Editor object: setViewMode(), zoomIn(), zoomOut()
• New events of the Editor object: beforeLineTitleMove, afterLineTitleMove, lineTitleMoveEnd, itemTarget, beforeItemCatch, afterItemCatch
• New properties of the Editor object: itemsDraggable
• New HistoryManager methods: add(), disable(), enable(), isRedo(), redo(), reset(), undo()
• New HistoryManager properties: disabled, saveDelay
• New Selection method: getSubId()

Check the full What's new list at https://docs.dhtmlx.com/diagram/whats_new/#version-41