This is a migrated thread and some comments may be shown as answers.

OrgChart

7 Answers 93 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Mohammad
Top achievements
Rank 1
Mohammad asked on 21 Apr 2012, 05:52 AM
I create orgchart sample such as telerik demo but i want bind data source from database.
it work fine with XML source files but when i want use source from database, appearance of my form Be broken.
please help me.

7 Answers, 1 is accepted

Sort by
0
Petar Mladenov
Telerik team
answered on 21 Apr 2012, 06:53 AM
Hi Mohammad,

When you bind the RadDiagram you have to make sure that your ViewModels for the Connections implement ILink  and the source collection implement IGraphSource. Probably you need to wrap your DB objects in order to apply this rules. You may find these two help articles useful:
RadDiagram DataBinding
RadDiagram  How To Use MVVM
If you still have issues, you can send us some code that we could investigate locally. 

Greetings,
Petar Mladenov
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Mohammad
Top achievements
Rank 1
answered on 30 Apr 2012, 01:05 PM
my problem is solve. thancks a lot for your soppurt.
when do you release Telerik Q2.2012 ?
0
Petar Mladenov
Telerik team
answered on 01 May 2012, 06:58 AM
Hello Mohammad,

 Telerik Q2 2012 Official Release is scheduled for the first half of June. 

Regards,
Petar Mladenov
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Dave Navarro
Top achievements
Rank 2
answered on 17 Aug 2012, 06:46 PM
Hello,

With your help, I've completed replicating the Silverlight 5 example in my project and now wish to replace the static data source with a dynamic data source from SQL Server.

I guess I have two options;
1. Create 'on the fly' an XML file (in memory) from the database and use the code 'as is' but with new data... or,
2. Rewire the diagram's  method 'PopulateWithData()' with code that reads directly from SQL Server.

Does anyone have any suggestions on which option would be best? My diagram will be in "read only" mode since the data comes from the db. I'll have methods in place to add people to the database but it won't be within the diagram's 'drag and drop' features.

Does anyone have any sample code they could share that demonstrates either option?

Please let me know and thanks!

~ Dave
0
Dave Navarro
Top achievements
Rank 2
answered on 19 Aug 2012, 08:29 PM
Hello,

I've got another question; I was able to setup a method that dynamically creates the XML file in memory however the images are in the database. So, what I've done is setup a dictionary and a method that preloads the images so I can stream them in when needed.

Here's the Org Chart Dictionary (OCD);
public Dictionary<string, byte[]> OCD = new Dictionary<string, byte[]>();

My question is this; how should I recode the node.imagePath to work with the data. It's currently looking for a string value that points to a file in the Assets folder. Now I'm providing a byte[] that will need to be streamed in.

Below is one attempt that obviosly doesn't work. You can see the two remarked lines of code that I replaced but the code isn't going to work unless I rewire the node.Image to process the byte[] data and stream it in...
private Node CreateNode(XElement element, Node parentNode)
        {
            Node node = new Node();
            node.PropertyChanged += this.OnNodePropertyChanged;
            node.FirstName = element.Attribute("FirstName").Value;
            node.LastName = element.Attribute("LastName").Value;
            node.Phone = element.Attribute("Phone").Value;
            node.Email = element.Attribute("Email").Value;
            node.Address = element.Attribute("Address").Value;
            node.Path = parentNode == null ? node.FullName : parentNode.Path + "|" + node.FullName;
 
            //string imagePath = "/bcRMS.RMS.DevAdmin;component/Assets/Images/{0}{1}.jpg";
            //node.ImagePath = string.Format(imagePath, node.FirstName, node.LastName);
            string imagePath = "app.OCD[\"" + node.FirstName + node.LastName + "\"]";
            node.ImagePath = imagePath.ToString();
 
            node.JobPosition = element.Attribute("Position").Value;
            node.Branch = (Branch)Enum.Parse(typeof(Branch), element.Attribute("Branch").Value, true);
            return node;
        }

Please let me know what I should do to rewire the node.image. What I'm hoping to do is simply read the stream and handle it like a typical radImage control.

Thanks!

~ Dave
0
Francois Vanderseypen
Top achievements
Rank 2
answered on 20 Aug 2012, 05:15 AM
Dave,

you should set the source of the image or replace the image altogether, simply setting a string will not work. Something like

private static BitmapImage LoadImage(byte[] imageData)
   {
       if (imageData == null || imageData.Length == 0) return null;
       var image = new BitmapImage();
       using (var mem = new MemoryStream(imageData))
       {
           mem.Position = 0;
           image.BeginInit();
           image.CreateOptions = BitmapCreateOptions.PreservePixelFormat;
           image.CacheOption = BitmapCacheOption.OnLoad;
           image.UriSource = null;
           image.StreamSource = mem;
           image.EndInit();
       }
       image.Freeze();
       return image;
   }

and using this returned BitmapImage as the Source of the XAML Image control.

Note that it's probably a good idea to wrap this call in an asynchronous method so that the loading of the images doesn't block the UI/diagram.

Hope this helps, Fr.
0
Dave Navarro
Top achievements
Rank 2
answered on 21 Aug 2012, 05:29 AM
Hello,

Well, thanks for your suggestions. I got it working... it actually didn't take as much code as I first thought.

Regarding the images;
First, I modified the Node.cs view model so that the nodes imagepath was no longer a string... but instead a bitmap;
public BitmapImage ImagePath { get; set; }

Then, I took Francois' suggestion and setup this minor modification right in the CreateNote method;
BitmapImage bImg = new BitmapImage();
bImg.SetSource((new MemoryStream(app.OCD["" + node.FirstName + node.LastName + ""])));
node.ImagePath = bImg;

And now the images and nodes are loading as hoped. They are both dynamically created as the form loads and from the database with only minor modifications to the original example code.

Thanks for your help!

~ Dave
Tags
Diagram
Asked by
Mohammad
Top achievements
Rank 1
Answers by
Petar Mladenov
Telerik team
Mohammad
Top achievements
Rank 1
Dave Navarro
Top achievements
Rank 2
Francois Vanderseypen
Top achievements
Rank 2
Share this question
or