1. Home
  2. Forum
  3. WPF
  4. How to add images in a SfDiagram's node using Annotation?

How to add images in a SfDiagram's node using Annotation?

Hello Synfusion staff,

I need to add some images to my node using the Annotation and C#. I know that there should be a way of doing that because of this https://www.syncfusion.com/kb/6823/how-to-add-image-annotations-to-a-node. However, I was not able to find an example of it neither in the documentation nor in the forum. I really would appreciate it if you could provide an example. 

Thank you,


Tomas

9 Replies
PP Prakash Perumal Syncfusion Team May 10, 2021 10:15 AM UTC

Hi Tomas,   
   
Thanks for contacting Syncfusion support.  
  
We have prepared a simple sample to add image in a SfDiagram's node using Annotation. Please find the sample below:  
  
  
Regards,  
Prakash P  


TO Tomas May 11, 2021 02:24 AM UTC

Hi Prakash Perumal,

This is exactly what I need, but because I am using an UserControl instead of  WindowControl I cannot access this.resource[]. Is there a way to fix this issue? (I tried this https://stackoverflow.com/questions/3747972/wpf-usercontrol-cannot-find-xaml-resource-in-referencing-project but it did not solved my issue)

Thank you,

Tomas

PP Prakash Perumal Syncfusion Team May 11, 2021 09:44 AM UTC

Hi Tomas,  
 
We assume that your requirement is to use UserControl instead of Window Control (Image). This can be achieved by adding instance of UserControl inside a DataTemplate and assigning it to ViewTemplate property of AnnoationEditorViewModel. Thus, the AnnoationEditorViewModel will act as DataContext for the UserControl and binding between them can be achieved.   
 
Please find the modified sample below:  
 
If our assumption is different, please explain your requirement in detail. This helps us to serve you better.   
 
Regards,  
Prakash P 


TO Tomas May 13, 2021 08:10 PM UTC

Hi Prakash Perumal,

I check your solution, but the problem remains. In my case, I do not have a WPF WindowControl as a base; my WPF code is part of an UserControl that is triggered from a Winform app. So, I am not sure how to make visible those properties.

Thank you,

Tomas.

KR Karkuvel Rajan Shanmugavel Syncfusion Team May 14, 2021 03:15 PM UTC

Hi Tomas, 
 
We have tried to create a winforms application with our SfDiagram control. But we are unable to structure the application based on your requirement. Please provide the details of the structure of your application. This will helps us to provide better solution. 
 
Regards, 
Karkuvel Rajan S 


TO Tomas replied to Karkuvel Rajan Shanmugavel July 18, 2021 03:29 AM UTC

Hello Karkuvel

The main menu of the application is a Winforms menu. It includes several buttons that open different windows within it. One of the buttons deploys a WPF form within an element host object. A DockingManager that contains an SFTreeView and an SFdiagram constitute this WPF UserControl. The same button allows inserting more tabs with SFDiagrams to the WPF UserControl. So, nodes are created by dragging or clicking the elements within the treeView, and then dropping them or clicking on the diagram area. One of those nodes must contain several images that may change dynamically (without changing the base image of the NodeViewModel). The annotation element seems to be the best way, if not the only one, of achieving this goal.

Thank you,

Tomas


KR Karkuvel Rajan Shanmugavel Syncfusion Team July 19, 2021 06:27 AM UTC

Hi Tomas, 
 
We have created a new support incident under your directrac account for " How to add images in a SfDiagram's node using Annotation?" query. Please follow the created incident for further updates. 
 
Regards, 
Karkuvel Rajan S 


TO Tomas replied to Karkuvel Rajan Shanmugavel July 20, 2021 12:05 AM UTC

Thank you Karkuvel.



SS Swetha Srikumar Syncfusion Team July 20, 2021 10:25 AM UTC

Hi Tomas, 
  
Most welcome. 
  
Regards, 
Swetha 


Loader.
Up arrow icon