We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Label text outside the boundaries of a node?

Thread ID:

Created:

Updated:

Platform:

Replies:

108291 Apr 11,2013 01:30 PM Mar 27,2017 08:37 AM WPF 5
loading
Tags: Diagram
Todd Lichtas
Asked On April 11, 2013 01:30 PM

Is it possible to have a label next to a node rather than contained within the node?  I have an application that will contain fairly small nodes, and the node labels are being cropped within the boundaries of the node.

Sudhakar C [Syncfusion]
Replied On April 12, 2013 12:49 AM

Hi Todd,

 

The Label is the part of the Node, so the Label should not be outside the boundaries of the Node. It should be remains within the boundary. However, to avoid the Label cropped with in the Node, we are suggested you to please set the LabelTextWrapping property of the node as Wrap. For more information please refer the following code snippet and attached image.

 

Code Snippet :

 

Node node = new Node() {Width=50,Height=50,Shape=Shapes.Rectangle,Label="LabelWithWraping"}; 

 

//Set the LabelTextWrapping

node.LabelTextWrapping = TextWrapping.Wrap;

diagramModel.Nodes.Add(node);

 

 

 

Please let us know if you require further assistance on this.

 

Regards,

 

Sudhakar C



WrapImage_b975171b.zip

Todd Lichtas
Replied On April 12, 2013 01:18 PM

I found a solution to my issue.  I created a second node with AllowSelect = false for each actual node to hold the label.  I then handled the diagramView_NodeDragging event to reposition the label node when the actual node is moved.  This gives the appearance of a label outside of the actual node.  Here's how I did it for anyone else that is interested.
 

Private Function addNode()

    'Create the actual node, but it is too small to display a label

    Dim actualNode As New Node()

    actualNode.Height = 15

    actualNode.Width = 15

    actualNode.Shape = Shapes.Triangle

    actualNode.OffsetX = 50

    actualNode.OffsetY = 50

    actualNode.Label = “Name”

    actualNode.LabelVisibility = Windows.Visibility.Hidden

    diagramModel.Nodes.Add(actualNode)

 

    'Create another node to act as a label for the actual node

    Dim labelNode As New Node()

    labelNode.Height = 20

    labelNode.Width = 80

    actualNode.Shape = Shapes.Rectangle

    labelNode.OffsetX = actualNode.OffsetX + 20

    labelNode.OffsetY = actualNode.OffsetX - 5

    labelNode.Label = “Name”

    labelNode.LabelHorizontalAlignment = Windows.HorizontalAlignment.Left

    labelNode.AllowSelect = False

    diagramModel.Nodes.Add(labelNode)

 

    'Add the NodeDragging event handler

    AddHandler diagramView.NodeDragging, AddressOf diagramView_NodeDragging

End Sub

 

 

Private Sub diagramView_NodeDragging(ByVal sender As Object, ByVal evtArgs As NodeRoutedEventArgs)

    'Identify the node being moved by label name and hidden properties, and reposition the label node with it.

    For i = 0 To diagramModel.Nodes.Count - 1

        If diagramModel.Nodes(i).Label = evtArgs.Node.Label And diagramModel.Nodes(i).LabelVisibility = Windows.Visibility.Visible Then

            If evtArgs.Node.LabelVisibility = Windows.Visibility.Hidden Then

                diagramModel.Nodes(i).OffsetX = evtArgs.Node.OffsetX + 20

                diagramModel.Nodes(i).OffsetY = evtArgs.Node.OffsetY - 5

            End If

        End If

    Next

End Sub

 

Sudhakar C [Syncfusion]
Replied On April 15, 2013 03:24 AM

Hi Todd,

 

Thanks for the update. Your previous update will be work fine. And also, please let us know if you have any other concerns. As always, we will be happy to assist you. Thanks for using Syncfusion Products.

 

Regards,

 

Sudhakar C


Michael Katsarakis
Replied On March 24, 2017 04:47 AM

node.LabelDisplacement = new Point(0, -50);

Ranjitha Amirthalingam [Syncfusion]
Replied On March 27, 2017 08:37 AM

Hi Michael, 
 
Thanks for your update. 
 
Yes. The reported requirement can be achieved by using the LabelDisplacement property of the Node. Please refer to the below screenshot. 
 
Screenshot: 
 
 
 
 
Regards, 
Ranjitha A. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;