How to create treeview and diagram with editing options in the WPF Diagram (SfDiagram)?

WPF TreeView and WPF Diagram (SfDiagram) elements editing can be synchronized by binding the operations of the elements as implemented in the following sample. Each tree view element can be displayed as a node in the diagram. The following editing operations are synchronized in the following sample.

• When you select any element in the tree view then the corresponding node in the diagram will get selected and vice versa.
• Editing the tree view element content will be reflected in the diagram node content as well. Similarly, when you edit node’s annotation content then that will be reflected in the corresponding tree view element.
• Adding and deleting the node in the diagram will be synchronized with tree view and vice versa.

View sample in GitHub.