Skip to main content

Guides

The guidance information explores in detail how to create a diagram of any complexity using DHTMLX Diagram. The documentation is segmented into task-oriented manuals which discuss the principles of building and configuring a diagram, the ways of editing its items. The guides embody a lot of tools to assist in actual use of DHTMLX Diagram: examples of usage, illustrations, animated images.

Diagram

The section details the process of adding DHTMLX Diagram on a page, describes the features of Diagram configuration, explains the way of scrolling a large diagram.

Diagram items

The section includes descriptions for all default diagram items (shapes, lines, groups, swimlanes), the way of adding custom shapes, and teaches how to configure the items and set connections between them.

Diagram Editor

Learn how to initialize Diagram Editor - a great tool which significantly accelerates the process of designing your diagram.

The guides give you a broad overview of all parts of the interface of the editor and their settings, present examples of customization of the interface elements you may have at your disposal.

Common guides

Read the articles to learn the ways of loading data into the Diagram, serializing and saving data, importing Diagram data into the Editor and exporting Diagram data in various formats. Here you will also find examples of data templates for different diagram items.

With the following articles you will be able to create a fully customized diagram and breath life into it: operate the diagram and its items via the API, attach handlers to the necessary events.

Learn how to adapt the diagram to various languages and easily edit the text elements.

Integration guides

The articles give you examples of usage a Diagram with different client-side frameworks.

TypeScript support

Browse the TypeScript Support guide with code snippets to learn more about built-in type definitions allowing you to write clean code faster.