Template Node Style Demo
This demo presents a node style implementation that leverages a simple data binding and
templating engine to declaratively render SVG as node style.
The templating engine is based on an implementation that was previously available in
yFiles for HTML versions 1.x and 2.x, but which has since been removed and is provided
here as a source code demo implementation.
With this style, node visualizations are defined by a SVG templating language, similar to
what is known in React, Vue, Angular, and similar frameworks.
TemplateNodeStyle's template language is a lot simpler and less powerful than
the templating support in the aforementioned frameworks, but it is more lightweight and
does not depend on third party software. It was modelled after the
XAML templating language.
Things to Try
Change the template of one or more nodes. Bind colors or text to properties in the tag.
Then, apply the new template by pressing the button. Or modify the tag and see how the
style changes.
Related Documentation
Related Demos