How to restrict a node to be able to only move along a connection

Jason,

Is there anyway that I can associate a Node (with a small circle shape) with a connection, and this Node can only move along the connection. When the connection moves, the node should also follow.

Thank you! Xiaochu

Hello Xiaochu

This is functionality you will need to implement at your end. In the node implementation, you could listen to when it's bounds property changes, and as a result, adjust the bounds to ensure that it is snapped to closest point on it's associated connection. Similarly, listen to when the Segments collection of a connection is changed and again adjust the position of the node. DiagramConnectionSegment has a method called GetClosestPointTo which gives you the closest point on the segments line to the given Point. The buffer value lets you limit how close to either end of the segment the point can be. Use a buffer of 0 if you want the node to be moved all the way to the ends of each segment.

Let me know if you have further questions about this.

-Jason Fauchelle

Jason,

I tried what you suggested and it works for the most part. There is only one small thing as shown in pic3, it seems that the method GetClosestPointTo does not consider the rounded curve of the corner.

Thank you! Xiaochu

Hello Xiaochu

Unfortunately this is somewhat expected. The GetClosestPointTo method works purely with the model objects of the diagram. But the rounded corners are provided by a path-builder which takes the model objects (that don't have any notion of rounded corners) and then adds the rounded corners to the connection visual.

There are 2 ways to work around this: You could use that buffer parameter I mentioned to limit how far the circle can get to the end of each segment. That way it can not appear off the connection at the corner. Or, you will need to implement your own GetClosestPointTo method which assumes the visual appearance of the connections, and incorporates the rounded corners into the calculation. Here is the code for GetClosestPointTo to help you get started:

  if (_prev == null)
  {
    return EndPoint;
  }
  Point endpoint = new Point(EndPoint.X, EndPoint.Y);
  Point startpoint = new Point(StartPoint.X, StartPoint.Y);
  buffer = Math.Min(buffer, Length / 2 - 0.1);
  if (buffer != 0)
  {
    double dist = GeometryUtils.Distance(startpoint, endpoint);
    if (dist != 0)
    {
      double deltaX = endpoint.X - startpoint.X;
      double deltaY = endpoint.Y - startpoint.Y;
      double smallDist = Math.Max(dist - buffer, 0);
      double factor = buffer / dist;
      startpoint = new Point(startpoint.X + (deltaX * factor), startpoint.Y + (deltaY * factor));
      factor = smallDist / dist;
      endpoint = new Point(StartPoint.X + (deltaX * factor), StartPoint.Y + (deltaY * factor));
    }
    else
    {
      return startpoint;
    }
  }
  double u = ((point.X - startpoint.X) * (endpoint.X - startpoint.X)) + ((point.Y - startpoint.Y) * (endpoint.Y - startpoint.Y));
  u /= Math.Pow(Math.Sqrt(Math.Pow(startpoint.X - endpoint.X, 2) + Math.Pow(startpoint.Y - endpoint.Y, 2)), 2);
  double x = startpoint.X + (u * (endpoint.X - startpoint.X));
  double y = startpoint.Y + (u * (endpoint.Y - startpoint.Y));
  Point result = new Point(x, y);
  double length = GeometryUtils.Distance(startpoint, endpoint);
  if (GeometryUtils.Distance(result, endpoint) > length)
  {
    return new Point(startpoint.X, startpoint.Y);
  }
  if (GeometryUtils.Distance(result, startpoint) > length)
  {
    return new Point(endpoint.X, endpoint.Y);
  }
  return result;

The GeometryUtils.Distance method simply calculates and returns the distance between 2 points.

-Jason Fauchele