Intro to yFiles
There are three approaches to learning the yFiles basics. You can choose any of them, according to your personal preference.
Work through the interactive beginners tutorials
If you prefer to learn by exploring and experimenting, check out the live tutorials included in this package.
There are several tutorials for the complete beginner:
- Getting started
- Creating a custom node style
As a prerequisite for this tutorial, you need to have opened the packages' project in
an IDE (i.e. WebStorm or VSCode), as described in
First-time setup. The first tutorial step can be
found relative to the package root, at
demos-ts/01-tutorial-getting-started
demos/01-tutorial-getting-started
Read and work through the written tutorial
The written tutorial takes you through the basic concepts of working with yFiles in a step-by-step manner. Links to detailed documentation are provided throughout this tutorial.
As a prerequisite for this tutorial, you need to have opened the package's project in an IDE (i.e. WebStorm or VSCode), as described in First-time setup.
Watch introductory videos
The yWorks YouTube channel provides several helpful videos introducing the most important steps and concepts. Start your journey to becoming a proficient yFiles developer.
Next steps
Experiment with demos
The yFiles package contains over 100 demos presenting the various features of the
library and how to use them in your own code. We invite you to open the various demos
in the IDE and experiment with them.
demos-ts
demos
Work through the interactive advanced tutorials
In addition to the tutorials for beginners, you'll find tutorials that deal with specific topics:
- Application features
- Creating custom styles for edges
- Creating custom styles for labels
- Creating custom styles for ports
- Layout tutorials
Further reading
The yFiles library includes comprehensive documentation about its concepts, features and API. Some entry points for beginners are:
- The graph model: learn the very basic concepts of graphs
- Displaying the graph: learn how a graph is displayed on the screen
- User interaction: learn how to configure and implement basic as well as sophisticated user interactions with the graph
- Customizing styles: learn to tweak the look and feel of the various graph elements
- How to use the various automatic layout algorithms provided by yFiles