WPF Zoom control

Question

How to implement zooming in wpf? Creating an application in which user can upload and draw on the map.On using zoom slider, user is not able to draw on the map. Without zoom slider the user is able to draw. Instead of third party controls, is there any way to implement zooming? I tried implementing it and i can see the slider in xaml but when i run it,the slider disappears

enter image description here Any ideas are greatly appreciated. Thanks a lot.

     <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="273.333"/>
                                    <ColumnDefinition Width="1026.667"/>
                                </Grid.ColumnDefinitions>

                                <Slider x:Name="uiScaleSlider" ToolTip="Determines the UI scale factor." Value="1" Minimum="0.1" Maximum="4" Margin="67,0,-67,-0.333" Grid.ColumnSpan="2"/>
                                <DockPanel Grid.Column="0" Grid.ColumnSpan="2" LastChildFill="True" Margin="0,0,0,-0.333">
                                    <DockPanel.LayoutTransform>

                                        <ScaleTransform 
        CenterX="0" CenterY="0"
        ScaleX="{Binding ElementName=uiScaleSlider,Path=Value}"
        ScaleY="{Binding ElementName=uiScaleSlider,Path=Value}"
    />
                                    </DockPanel.LayoutTransform>
                                    <Canvas x:Name="drawingCanvas" Margin="0,10,85,33">
                                        <Canvas.Background>
                                            <ImageBrush ImageSource="../Images/canvas.png" AlignmentX="Center" AlignmentY="Center" Stretch="Fill"/>
                                        </Canvas.Background>
                                    </Canvas>
                                </DockPanel>
                            </Grid>
                        </ScrollViewer>
                        <GridSplitter Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Top" ResizeDirection="Rows" />

                    </Grid>

Answer 1

The best way to do this is to use a ViewBox. I've described a similar scenario here: Creating a WPF Window that allows zooming and panning