Skip to main content

Release 6.6.4

· 2 min read
Simon Porritt

Organization chart starter app​

We've added a new starter app - Organization chart. It uses our Hierarchy layout and inspector component to provide a solid foundation for your own org charts, with some nice navigation between elements.

Organization chart - jsPlumb Toolkit - JavaScript diagramming library that fuels exceptional UIs

The org chart starter app showcases several features of the Toolkit:

  • The Hierarchy layout makes it a snap to arrange items in a hierarchical view
  • The Surface element has a number of helper methods to let you navigate around the dataset. In this app we take advantage of the Surface's ability to smoothly pan to and zoom in on a specific element.
  • We use the inspector to provide a detail view of each individual, and from inside the inspector we can navigate the chart.
  • For rendering in this app we use HTML elements, which we can easily style.

Zooming and panning​

  • We've made a couple of updates to the internals of the Surface widget, to improve the way we animate a zoom and pan operation. You can see the results in our new Organization chart starter application.

Inspector component​

  • It's now possible to switch off the template cache in the Inspector component. This allows you to serve a template for a given object whose content is based upon the data contained within the object. In previous versions once a template had been retrieved for a given combination of object type (node/group/edge/port) and type, the template was cached for the duration of the page load.

Start a free trial

Sending your evaluation request...

Interested in the concepts discussed in this article? Start a free trial and see how jsPlumb can help bring your ideas to market in record time.

Get in touch!​

If you'd like to discuss any of the ideas/concepts in this article we'd love to hear from you - drop us a line at hello@jsplumbtoolkit.com.