Hi,
I need a representation as attached. The below link fulfills half of my requirement.
http://help.infragistics.com/Help/Doc/WPF/2014.2/CLR4.0/html/xamDiagram_Binding_to_Hierarchical_Node_Data_with_References.html
My Implementation has below class structure:
public class Employee : INotifyPropertyChanged
{
private string _name;
public string Name { get { return _name; } set { _name = value; OnPropertyChanged("Name"); } }
private ObservableCollection<Employee> subordinates;
public ObservableCollection<Employee> Subordinates { get { return subordinates; } set { subordinates = value; } }
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string propertyName) { if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); }
}
I'm not able to make the lower portion of the image (nodes linked to each other from left to right). The representation should flow from Left to Right.
Can anyone please help me in this.
Note: I'm using XamDiagram 14.2. You can assume, that I'm able to add XamDiagram and playaround it.
Hello Varun,
Thank you for your reply.
I am very glad that my suggestion was helpful for you. Please let me know if you need any further assistance on the matter.
Thanks for your reply.
Issue is resolved.
Thank you for your post.
I have been looking into your requirement and the code snippet, that you have provided. What I can suggest is to modify your DataTrigger by adding Converter to your Binding and bind to the Content of DiagramNode. In the Converter you can get the value as object from your underline data and return the EmployeeType that you want. I created a short sample application based on your scenario to show you how you can implement the functionality that you try to achieve. Please let me know if I missing something from your scenario.
Please let me know if you need any further assistance on the matter.
Thanks for the solution you provided.
It cleared all my doubts, and is running perfectly.
I have another query in this:
I want to color each node based on the data, which is present in my collection. For eg. EmployeeType as Manager, Trainee etc.
I was applying DataTriggers in The NodeStyle, but the Binding is returning ViewModel's object, due to which binding is failing.
The Code is as below:
<ig:NodeDefinition.NodeStyle> <Style TargetType="{x:Type ig:DiagramNode}"> <Setter Property="Width" Value="Auto" /> <Setter Property="ShapeType" Value="Ellipse"></Setter> <Setter Property="StrokeThickness" Value="0"></Setter> <Setter Property="HorizontalContentAlignment" Value="Center"></Setter> <Setter Property="VerticalContentAlignment" Value="Center"></Setter> <Setter Property="Padding" Value="3" /> <Setter Property="HorizontalAlignment" Value="Left"/> <Setter Property="VerticalAlignment" Value="Top"/> <Style.Triggers> <DataTrigger Binding="{Binding DataItem.NodeDetails.EmployeeType}" Value="Manager"> <Setter Property="Fill" Value="Green"></Setter> </DataTrigger> <DataTrigger Binding="{Binding DataItem.NodeDetails.EmployeeType}" Value="Trainee"> <Setter Property="Fill" Value="Cyan"></Setter> </DataTrigger> </Style.Triggers> </Style> </ig:NodeDefinition.NodeStyle>
Please Help.
Hello Varun ,
I have been looking into it and the image that you have provided. I am not sure that I understand correctly your requirements. I assume that you want to use the TreeLayout of XamDiagram. I created a short sample application based on your scenario to show you how you ca achieve it. In the sample I used your data structure and created TreeDiagramLayout by using NodeDefinitions and ConnectionDefinitions. You can see more samples about TreeLayout in XamDiagram from our WPF Samples Browser under the tag -> XamDiagram -> Organization -> TreeLayout.
Please let me know if you need any further assistance on the matter