Diagram Zoom through Button


I’m trying to zoom the diagram buy clicking the “Zoom In” & “Zoom Out” button by binding these to IncreaseZoom & DecreaseZoom command respectively.

But, it is not working. Clicking these button doesn’t do anything. The buttons are disabled.

Another issue is, whenever I drag & drop a node to the diagram it repositions. Its kind of annoying. How do I disable the repositioning?
(Solved this by using HorizontalContentAlignment & VerticalContentAlignment set to “Stretch” value on go:Diagram)

Code Sample:

<go:Diagram x:Name=“diagram” AllowDrop=“True” NodeTemplate="{StaticResource ResourceKey=NodeTemplate}" HorizontalAlignment=“Stretch” VerticalAlignment=“Stretch” AllowMove=“True” AllowEdit=“True” AllowScroll=“True” AllowUndo=“True” AllowZoom=“True” Background=“WhiteSmoke”></go:Diagram>

Thank you Smile

[This topic is only for WPF.]

That’s not how one uses CommandBinding – you’re trying to get the Button to handle the IncreaseZoom command by having it do nothing, which is probably what it would normally do anyway, since most people don’t want to zoom into a Button.

Since Buttons can get focus, you need to specify the CommandTarget.

This works well for me:

<Button Command="IncreaseZoom" CommandTarget="{Binding ElementName=myDiagram}">In</Button> <Button Command="DecreaseZoom" CommandTarget="{Binding ElementName=myDiagram}">Out</Button>
Or this for the Diagram, where the focus doesn’t change:

<ContextMenuService.ContextMenu> <ContextMenu> <MenuItem Command="SelectAll" /> <MenuItem Command="IncreaseZoom" /> <MenuItem Command="DecreaseZoom" /> <Separator/> <MenuItem Command="Delete" /> <MenuItem Command="Copy" /> <MenuItem Command="Paste" /> </ContextMenu> </ContextMenuService.ContextMenu>

Thanks. Got it working.

Another question. I was thinking about using the Slider control to Zoom In/Out the diagram. How do I pass the value of the slider to the Zoom command?

Look at the zooming Slider in the Org Chart Static sample.