Graphs and Diagrams

In yFiles for HTML, a graph is defined as a set of objects where some pairs of objects might be connected. We call such an object a node (instead of entity, vertex, or element) and a connection an edge (instead of link, relation, or arc). The edges might be directed or undirected.

A diagram is the visualization of the data represented by a graph. However, we often do not distinguish between the two terms if the meaning is clear from the context.

The ambiguity of the terms graph and visualization causes a common misunderstanding of the purposes of yFiles for HTML.In particular, the yFiles for HTML library does not provide any functionality to draw pie charts, function plots, or anything the like.

Diagrams of any kind naturally arise in a wide variety of application domains. Often, a node is represented by a visualization like a shape, icon, or image. An edge is usually represented by a connecting line between its two nodes, with or without any kind of decoration at its ends. Often, captions or labels provide extra textual information.

The benefits of diagrams can be summarized with the proverb “a diagram is worth a thousand words:”

• Subjects of arbitrary complexity can be arranged to get a clear picture of hidden structures and dependencies.
• Gordian relationships can be clarified in a matter of seconds.
• Information is communicated to a broad audience easily.

However, these properties strongly depend on the quality of a diagram. And the task of making legible diagrams is often tedious and moreover, error-prone when done by hand. Sketching even small data sets can become awkward enough to forsake entirely.

With large data sets, the problem of making high-quality, easy-to-understand diagrams aggravates. Doing it by hand is no longer an alternative, so the need for an automatic generation grows.