Draw a border on DiagramPanel to indicate bounds

I have a DiagramPanel that is the main working canvas in the view. On the bottom right side of the view is a smaller view containing an Overview of the DiagramPanel. Bound to the DiagramPanel Scale property is a Slider. The slider is used to zoom in and out the DiagramPanel. For the most part this is working very well. There is a defined area on the DiagramPanel that placement of nodes is valid (basically a rectangle 0,0,1000,1000), which I set Diagram.Panel.FixedBounds to.

When I set a Border on the DiagramPanel it adds the border around the entire DiagramPanel including the scrollbars when zoomed out to see an area larger than I want as a defined as the fixed bounds.

I have code in the ViewModel to restrict placement outside of the defined bounds, but what I have not been able to find is a way to draw the border so the users have a visual indication of valid area where nodes can be placed when the view is zoomed out.

Did you get the basic structure of your code from the Org Chart (static) sample?

The DiagramPanel is the control where the Parts can be seen. If you want to show an area in model coordinates where you would like the user to do something, I recommend that you use an unbound Node. The advantage of doing so is that it will scale and scroll automatically along with the rest of the diagram’s contents, independently of the DiagramPanel which is laid out by the WPF (or Silverlight?) system. You can also control which Layer that that rectangle is in, so that it is drawn entired in front of or entirely behind the Nodes and Links, in whichever manner you prefer.

Yes the basic structure is based on the Org Chart (static) sample.

Is there another sample that uses the unbound Node to place behind the Nodes and Links we can learn from to provide an area for user to work within?


Read the section about “Decorative Elements and Unbound Nodes” in the GoXamIntro (GoXamIntro.htm).

Basically, you can make a Node that is an XAML element inside your go:Diagram. This is not bound to model data. The Node gets added to the Diagram.PartsModel. If you don’t want to do it in XAML, create it programmatically and add it to the PartsModel yourself.

You can probably find other examples of this in the samples.