diagram overview

Hello, I created a diagram overview, a minimap of the diagram can be shown correctly, now I want to have a small red box over the minimap, and it is movable, when the user move the red box, the diagram part in the red box will be shown in the bigger view. I want to calculate the which part should be shown in the bigger view, but if the user scroll the scrollbar a lot, the diagram will become very large, but he minimap is still the same. Please see the attachment. Do you have any idea? Thanks.

Hello

To get this functionality, you'll need to implement a control to display the red box over the minimap. You'll need to handle the ability for the user to drag the red box to change the view port, and also change the position of the red box as the user scrolls and zooms the actual diagram. To get started, go to this forum thread: http://www.mindscapehq.com/forums/thread/337220. In the second post, I have attached a simple demo that shows how to create a view-finder-box that listens to the viewport of the diagram surface and changes the position and size of the view-finder-box over the minimap. Note that this does not include interaction for the user to drag the view-finder-box around, but this can be added in later. This demo will be a great place for you to start implementing this feature. If you need any help, let me know.

Jason Fauchelle

Hello Jason, Thanks for the demo app, I start from your app, and try to set the view port of the main diagram when I am moving the finder-box, but what I see is very strange, the code the set the view port as below

Rect minimapViewport = Minimap.GetViewport();

double horizontalRatio = minimapViewport.Width / Minimap.ActualWidth; double verticalRatio = minimapViewport.Height / Minimap.ActualHeight;

Rect newViewPort = new Rect(_frame.Margin.Left * horizontalRatio, _frame.Margin.Top * verticalRatio, _frame.Width * horizontalRatio, _frame.Height * verticalRatio);

MainDiagramSurface.SetViewport(newViewPort);

is it correct? I have attached my modified project, the code is in the frameMouseMove event handler?

Thanks

Hello

What you have done so far is very good. I have attached a modified version of the sample you sent. I have fixed up any issues that I found. Here are the main things that I changed:

In frameMouseDown I let the frame capture the mouse, and then I release the mouse capture in frameMouseUp. This resolves any issues related to releasing the mouse when the mouse is not over the frame, in which case the frame would incorrectly think the mouse button is down.

I added an updateLock boolean field which is used to lock the _frameMouseMove and the UpdateFrame methods. Note that the UpdateFrame method is called whenever the viewport of the main diagram is changed. The frameMouseMoved method causes the viewport of the main diagram to change which then causes the UpdateFrame method to be called. But in this case, we were the ones to update the frame, so we don't want the changes to the viewport to cause the frame to be updated again. This causes issues with bounds detection on the frame position. This lock variable allows you to lock the UpdateFrame method when you are updating the frame manually in the mouse move method.

Last of all, when calculating the newViewPort (line 130), I added minimapViewport.X to the x position, and minimapViewport.Y to the y position. This allows the physical-to-logical conversion to start from the top left corner of the logical viewport rather than 0,0.

If you have any questions about this code, or there are any issues that I missed, let me know and I'll help you out.

Jason Fauchelle