dhtmlxDiagram is a client-side chart component that allows you to display relations between some objects, concepts or living beings in a visual form: as a scheme, chart, organizational chart, etc. The diagram makes it easier to present tangled and bulky information in a simple and accessible way.
You can choose between several options:
dhtmlxDiagram component provides the possibility to make various diagrams using a predefined set of shapes and connectors, and experiment with their look and feel via the "native" and custom CSS classes.
You can choose shapes of desired types or create your own types of shapes, link them by suitable connectors and build any type of a diagram that will show the sequence of some operations making up a particular process, like this:
The following list of guides will help you to learn more about dhtmlxDiagram:
dhtmlxDiagram goes with an editor that lets you build your own diagram: you need just to choose desired shapes and set connectors between them. Besides you can:
You can read more information about Diagram Editor.
There is also a predefined diagram type for rendering an organizational chart - Org Chart. This type of a diagram contains a set of shapes connected by lines in a hierarchical order.
Each shape has a text and a colored header line. Shapes located on the same level have headers of identical color. Optionally, you can add an image into a shape.
The following list of guides will help you to learn more about Org Chart:
The Org Chart Editor is a part of the dhtmlxDiagram library that allows building an org chart quickly: you need to select a shape and add a new child for it. Also you can:
You can read more information about Org Chart Editor.
In addition to creating Diagram or Org Chart with usual types of shapes, dhtmlxDiagram provides a great possibility to combine Diagram with Org Chart into a single diagram. Therefore, building a diagram with mixed types can be implemented in two ways:
Now you can start building your own diagram step-by-step by following the How to Start tutorial.
You can also skip the basics and head for detailed guides and instructions:Back to top