dhtmlxDiagram 1.0 is Out: Use Robust JavaScript Org Charts

| Comments (7)

The story of our JavaScript organization chart library begins today. Meet dhtmlxDiagram, our brand new js component, that will allow you to add interactive diagrams such as organization charts to your applications.

Org Charts

Under the first release, dhtmlxDiagram 1.0 features the ability to build organization charts of any complexity. An organizational chart represents the most natural way of displaying the hierarchical structure of an organization. You can use it to show the structure of a company, business, or project team. View samples

javascript org chart

Such diagrams may have different purposes. You can use them as management tools that help to define the area of responsibility for each team member, as a personnel directory, etc.

Organizational charts display work responsibilities in an intuitive way which allows improving the work of communication lines and helps each member of the organization understand how their work fits into the overall scheme.

What makes dhtmlxDiagram so good?

  • All dhtmlx libraries provide extensive JavaScript API for flexible configuration and dhtmlxDiagram is not an exception.
  • 3 predefined types of nodes: text, image, or any other custom HTML and SVG element. You also have the ability to create custom nodes based on your needs.
  • Provide a custom and unique look and feel for your org chart through CSS.
  • You can enable vertical mode to provide a compact view for your diagram.
  • vertical diagrams js org chart

  • Being a 100% JavaScript library, dhtmlxDiagram can be used with any server side without any limitations.
  • Our JavaScript Organization chart will be perfectly rendered in all modern web browsers.

Find out more

Ready to start?

With dhtmlxDiagram, you can use different types of organizational charts to create a visual representation that better reflects the structure of your company.

The next updates will bring you the ability to embed the javascript org charts to your application and let the end users create their own graphs. Also, there will be more types of diagrams in addition to the organization charts. Stay tuned!


  1. Solomon Thuo October 2, 2017 at 1:00 pm

    This is wonderful!

  2. Greg October 2, 2017 at 5:19 pm

    Is this component compatible with responsive design?

    • Aras Kairys (DHTMLX team) October 2, 2017 at 5:57 pm

      Hi Greg,
      dhtmlxDiagram can adjust itself to different screen sizes. You can also use scale functionality to fit content event on small screen devices.

  3. Terry October 2, 2017 at 5:47 pm

    Is same view is exists on Internet Explorer 11 and MS Edge ?

    • Aras Kairys (DHTMLX team) October 2, 2017 at 6:32 pm

      Hi Terry,
      Diagram widget works well on both IE11 and IEEdge.

  4. Rakesh July 11, 2018 at 12:14 am

    I need to use diagram with Angular 5. I couldn’t find any typedef or sample projects.

    • Liudas Kairys (DHTMLX team) July 12, 2018 at 12:04 pm

      Hi Rakesh,
      You can use dhtmlxDiagram with Angular 5, though unfortunately, we don’t have any guide for this at the moment.
      Please check these guides for dhtmlxGantt and dhtmlxScheduler, the approach is similar: https://dhtmlx.com/blog/tag/angular/

Leave a Reply