Drawing dynamically positioned overlays on Images in wpf

Question

I have an Image control in my view bound to BitmapSource prop in my View Model. This property is updated with images from a camera in my Model class. To get started with drawing shapes on images (so 1 control ON another),after reading a similar post, I tried the following with a simple Rectangle shape with Zindex=2 so it should act as an overlay over the image. But the below doesn't work & all I see is the image from the camera

<Canvas>
        <DockPanel Width="400" Height="250">
            <Label DockPanel.Dock="Top" HorizontalAlignment="Center" 
                   Content="IMAGE FROM CAMERA" Width="Auto"/>

            <Image x:Name="CamImageDisplay" 
                     DockPanel.Dock="Left"
                     Source="{Binding  CurrentImage, Mode=OneWay}"   
                     Stretch="None" Width="Auto"/>

            <Rectangle  Width="10" Height="5"
                        Fill="CadetBlue" 
                        Panel.ZIndex="2"  />
        </DockPanel>

    </Canvas>

I come from an MFC background where drawing shapes on bitmaps was as easy as calling Draw3dRect(...). Having said that, my goal is to draw a collection of shapes (just rectangles & circles) that will have different co ordinates with each new image.

Could some one please explain in simple terms or point to some reference that will show how I can achieve this. Yes, there are other similar questions, but they are really not quite aligned with my objectives. Thank you & please ask for clarifications if I am unclear in how I have asked my question.