yFiles FLEX makes it easy to integrate sophisticated graph visualization and editing functionality into a rich Internet application based on Adobe® Flex® or AIR™. The framework provides a full-featured Flex UI component for viewing and editing diagrams along with a comprehensive graph drawing and editing class library.
Why choose yFiles FLEX?
yFiles FLEX provides essential building blocks for web-based applications that need to visualize, animate, and edit graphs, diagrams, or networks.
Web diagramming applications using yFiles FLEX offer a user experience that was known previously only from desktop applications. And all that in your web browser.
- No browser compatibility issues! Your yFiles FLEX application will look the same no matter which browser and operating system it runs in. The only requirement to run a Flex 2 application is an installed Flash Player version 9. The Adobe Flash Player is installed on most Internet-enabled PCs today.
- Full-featured web-based graph viewing, editing and animation. The yFiles FLEX framework allows you to easily create rich Internet applications (RIAs) providing the same user experience as regular desktop applications. You will benefit from the usual advantages of RIAs over thin client approaches: richer user interfaces, higher responsiveness, better client/server work balance, asynchronous communication, and higher network efficiency.
- Benefit from our graph drawing software experience. All our expertise from the development of our other successful graph drawing products (yFiles for Java, yFiles.NET and yEd) was leveraged for the development of the yFiles FLEX API.
Outstanding Features
Highly customizable node and edge styles:
The style API of yFiles FLEX offers easy to use default style classes as well
as a convenient framework to create your own node and edge styles.
Nodes may also be represented by image files (both bitmap based and scalable formats
are supported) or SWF movies.
Auto-layout:
You can choose from automatic layout calculation both through a server component
as well as directly on the client.
GraphML:
yFiles FLEX supports this human readable, XML-based format to exchange graph
structure and style information.
Interaction:
The client API provides extensive, easily customizable user interaction functionality
for your diagramming applications.
Support for creating, moving, and resizing graph items is included, as well as for
tooltips and context menus.
Animation:
With yFiles FLEX you can create and easily customize morphing animations between
graph layouts.
Also, hover effects for nodes are supported.
Remote API:
The framework provides convenience classes to facilitate communication with a yFiles
server component.
yFiles FLEX Product Types
yFiles FLEX is available in three different editions which all provide your
diagramming application with sophisticated client-side graph visualization and editing
functionality.
The bundle editions additionally contain either a Java-based or a .NET-based yFiles
server component which provides state-of-the-art automatic graph layout and graph
analysis support.
yFiles FLEX Client comes without server component, but can be combined with
an additional extension package for client-side automatic layout calculation.
yFiles FLEX |
yFiles FLEX |
yFiles FLEX |
Learn more about the yFiles FLEX product types.
Graphity Diagram Editor
The Graphity Diagram Editor is an application which uses the yFiles FLEX client library. It is a powerful graph editor which makes use of the editing and visualizing capabilities of yFiles FLEX. Furthermore, it communicates with a yFiles for Java server to apply automatic layouts to the diagrams. Test it now and get a broad overview of the library's features.
Demo Applications
Graph Canvas
The graph canvas demo application demonstrates graph parsing, layout and navigation with yFiles FLEX.
Various GraphML files that are present in a defined directory on the server can be loaded into the view using the provided combobox.
At first, the graph will be loaded using the node coordinates specified in the GraphML file.
The graph layout can be changed using the
Layout combobox. This will prompt the server to compute a new layout for the current graph.
The Help tab in the application documents the various possibilities of user interaction with the diagram shown in the view component.
If the currently loaded graph provides description data for any nodes or edges, this data will be shown in tooltips that appear when hovering over the graph items. If the graph provides URLs, the context menu of the corresponding items will contain an entry that will load the URL in a new Browser window.
Organization Chart
The organization chart demo application shows how an interactive view for an organization chart can be created using yFiles FLEX. The displayed graph is generated using XML data models. The user can switch between several different sized example org-charts, where one of these also features group nodes to illustrate departments.
Among other things, the organization chart demo shows
- how to create a custom, specialized graph visualization component,
- how to create a yFiles FLEX graph structure from XML data,
- how to use the template node style for complex node visualizations,
- how to use different levels of detail for the node visualizations, depending on the zoom level,
- how to customize the yFiles FLEX overview component,
- how to create a custom zoom effect
The Business Process Diagram Demo
The business process diagram demo shows how an editor for business process diagrams can be created using yFiles FLEX.
The visualization and business logic is based on the BPMN 1.1 specification but isn't meant to implement all aspects of the specification. Instead, it demonstrates what techniques offered by yFiles FLEX can be used to create such an editor: custom node styles, using Flex components for node visualizations, custom edge styles and arrows, grouping functionality, swimlanes, drag 'n' drop, customized edge creation, custom input modes, custom data objects associated with graph items, and customized server-based layout calculation.
DOM Tree
The DOM tree demo application demonstrates the powerful combination of a yFiles for Java Complete server, yFiles FLEX API and
standard Flash animation and effect capabilities.
The demo provides a text input field for entering URLs. The HTML page that is found at the given
location is parsed into a tree structure on the server. In addition, the server calculates a layout for the resulting
tree structure and annotates the
nodes with their HTML tag type.
The client then displays the generated tree. When the user hovers over a node, a flash effect is triggered
which enlarges the node and displays the corresponding HTML tag type as a label.
Grouping
The Grouping demo application demonstrates the handling of grouped graphs.
Nodes can be grouped and ungrouped using the toolbar buttons. A node can also be added to a group node or removed from a group node by dragging it with the Shift key held down. The group which will be the node's parent is indicated by highlighted corners.
The hierarchy tree component on the left can be used to browse the hierarchic structure of the graph
Drag and Drop
The Drag and Drop demo application demonstrates the interaction of the yFiles FLEX client library and the Flex Component and Drag and Drop framework. The demo features an accordion component containing three palettes each holding different kinds of node styles. The node styles can be selected as the default node style for node creation or nodes can be created by dragging a node style from the palette to the view. In addition, automatic layouts can be calculated for the manually created graph.
Documentation
- yFiles FLEX Developer's Guide (online)
- API documentation (online) of the yFiles FLEX client library
- Knowledge Base articles (online), which answer frequently asked questions, or present solutions concerning yFiles FLEX
Commercial Information
Learn more about the terms and conditions for the commercial or academic use of yFiles FLEX:For ordering information and prices, please contact: sales@yWorks.com.
Evaluate yFiles FLEX
You can test and experience yFiles FLEX with a 30-day, fully functional evaluation version.

















