Browser Incompatibility

This demo browser application utilizes modern HTML and CSS functions. Please update your browser or use a current Chrome or Firefox browser to view this application.

The actual yFiles for HTML library is compatible for IE9 and newer browsers. For more details see the  browser compatibility.

After closing this information, you will be redirected to the plain yFiles for HTML demo overview page which contains all of the demos.

About the yFiles for HTML Demo Browser

The yFiles Demo Browser showcases the features of the yFiles for HTML library. Explore the examples to see just how easy it is to develop powerful applications for viewing, editing, and organizing data with yFiles. Download the yFiles for HTML trial and get started today!

yFiles is also available for JavaFX, Swing, .NET, and Flex, enabling you to easily develop the applications your customers need on any platform.

yFiles for HTML is third party code free. See the credits for details about additional open-source software that is used in this browser application.

Graph Viewer
This diagram viewer displays sample graphs from various domains. Users can change the view port and zoom level but are not allowed to edit the diagrams.
Layout Styles
This demo showcases the various layout algorithms of yFiles, including hierarchic, organic, orthogonal, tree, circular and balloon styles. Additionally, it presents the powerful and highly customizable graph editing capabilities of the graph view component.
Organization Charts
This organization chart viewer allows you to interactively explore a company's staff. Hide the managers or subordinates of employees, zoom in to watch their personnel data, and let the automatic layout algorithm arrange the diagram for you when you re-show hidden persons.
Business Process Models
This sample application allows you to create and edit Business Process Diagrams (BPMN), and to arrange them with the specialized BPMN layout algorithm.
This sample editor for Mindmaps features a tailored in-place pop-up menu for nodes that provides fast access to the main commands. Moreover, it shows highly customized visualizations for nodes and links, and automatically arranges all the items in an orderly tree diagram.
Hierarchic Grouping
This demo shows how to nicely expand and collapse sub-graphs organized in groups. Folding ('collapsed groups') can help to keep complex hierarchically organized diagrams clear and concise by showing only parts of the entire structure.
Incremental Hierarchic Layout
This demo shows the incremental mode of the hierarchic layout algorithm. Each user action triggers a run of this layout algorithm to ensure that the current state of the graph is always well-organized but remains still similar to the previous arrangement.
Interactive Organic Layout
This demo shows the Interactive Organic layout algorithm. This variant of the general Organic layout algorithm calculates continuous updates for a changing diagram. The Organic layout is a force-directed layout style for multiply purposes.
Collapsible Tree
This demo shows interactive collapsing and expanding of subtrees of a graph. Using the dedicated helper classes for filtering-out parts of a graph and the tree layout algorithm, implementing such an interactive application is easy.
Table Editor
This demo shows the support for diagrams that are organized in a tabular way, for example in a grid or a swimlane layout. Besides model items and styles for Tables, yFiles provides dedicated editing features to add, remove, resize, and reparent rows, columns, and the table contents.
Shortest Path
This demo shows the capabilities of the Shortest Path algorithm of yFiles. Besides Shortest Path, yFiles contains a variety of typical graph analysis algorithms, for example for Cycles, Trees, Connectivity and Graph Search.
Network Monitoring
A basic network monitoring demo which shows animated edge styles as well as the usage of D3.js in popup labels.