Rendering Labels with TranslateTransform

it’s not a bug in WPF, it’s a subtle interaction between Canvas layout, Margin, and RenderTransform.

Why lblN looks different than lblS

• You’re using a TranslateTransform to shift everything so that (0,0) is in the middle of the canvas.

• For the lines, this works fine because their coordinates are relative to (0,0).

• For the labels, however, you’re mixing two layout systems:

  • Canvas.Children normally positions elements using Canvas.Left and Canvas.Top.

  • You’re instead using Margin (which is interpreted differently depending on alignment).

  • Then you apply a RenderTransform on top of that.

So the label at Margin(0, -300, 0, 0) ends up being offset differently than the one at Margin(0, 300, 0, 0) because the negative margin interacts with the control’s alignment and layout pass. That’s why “N” looks shifted compared to “S”.

How to Fix It

Instead of using Margin, place the labels with Canvas coordinates and then apply the transform:

Label lblN = new Label();
lblN.Width = 50;
lblN.Background = Brushes.Red;
lblN.Content = "N";
lblN.HorizontalContentAlignment = HorizontalAlignment.Center;
lblN.VerticalContentAlignment = VerticalAlignment.Center;
lblN.Padding = new Thickness(0);
lblN.BorderBrush = Brushes.Black;
lblN.BorderThickness = new Thickness(2.0);

// Position relative to (0,0)
Canvas.SetLeft(lblN, -25);   // half width to center horizontally
Canvas.SetTop(lblN, -300);   // move up
lblN.RenderTransform = tt;
canvas.Children.Add(lblN);

Label lblS = new Label();
lblS.Width = 50;
lblS.Background = Brushes.Red;
lblS.Content = "S";
lblS.HorizontalContentAlignment = HorizontalAlignment.Center;
lblS.VerticalContentAlignment = VerticalAlignment.Center;
lblS.Padding = new Thickness(0);
lblS.BorderBrush = Brushes.Black;
lblS.BorderThickness = new Thickness(2.0);

// Position relative to (0,0)
Canvas.SetLeft(lblS, -25);
Canvas.SetTop(lblS, 300);    // move down
lblS.RenderTransform = tt;
canvas.Children.Add(lblS);

Note

• Use Canvas.SetLeft/SetTop for positioning inside a Canvas.

• Avoid Margin in this scenario — it’s meant for layout panels like Grid or StackPanel, not for absolute positioning.

• With Canvas.SetTop and Canvas.SetLeft, both “N” and “S” will render symmetrically.