DHTMLX Diagram with Angular Demo

The DHTMLX JavaScript Diagram library allows developers to create interactive, customizable diagrams such as flowcharts, organizational charts, network diagrams, mind maps, etc. It simplifies complex data visualization by organizing it into a clear hierarchical structure using automatic layouts and live editors.

How to start

Clone the repository or download files.

yarn
yarn start

npm install
npm run start

You can also use GitHub Codespaces to run online.

DHTMLX Diagram key features

Live Diagram, Org chart, and Mindmap editors for a quick diagram arrangement
Orthogonal and Radial auto layout modes
Adding partner and assistant shapes
Searching and filtering

Creating swimlanes and groups
Expanding and collapsing branches
Creating custom shapes

Group work with multiple objects (select, copy, move, delete)
Intuitive drag-n-drop behavior
Snap lines
Configurable Toolbar, Shapebar, and Editbar elements

Built-in themes
Inline editing
Touch support
Keyboard navigation
Cross-browser support
Export to PDF and PNG

License

This demo is available under the Evaluation license. To use it in your projects, please choose a proper license on the DHTMLX website: https://dhtmlx.com/docs/products/licenses.shtml

Useful links

Other examples

Check out examples of using DHTMLX Diagram with other technologies:

JavaScript	React	Vue

Join our online community

Star our GitHub repo
Watch our tutorials on YouTube
Read us on Medium
Follow us on X
Check our news and updates on Facebook