Overlay a smaller image over larger image using WriteableBitmapEx Windows Phone

Question

In my hidden object game, I want to mark the object with a circle image when found with the following code where AnsX1, AnsX2, AnsY1, an AnsY2 is the pixel coordinates of the object location. The circle image should be resized according to the object size marked by the pixel coordinates

        imgCat.Source = writeableBmp;

        WriteableBitmap wbCircle = new WriteableBitmap(AnsX2 - AnsX1, AnsY2 - AnsY1);
        wbCircle = new WriteableBitmap(0, 0).FromContent("Images/circle.png");

        //Just to make sure the boundary is correct so I draw the green rec around the object
        writeableBmp.DrawRectangle(AnsX1, AnsY1, AnsX2, AnsY2, Colors.Green);

        Rect sourceRect = new Rect(0, 0, writeableBmp.PixelWidth, writeableBmp.PixelHeight);
        Rect destRect = new Rect(AnsX1, AnsY1, wbCircle.PixelWidth, wbCircle.PixelHeight);

        writeableBmp.Blit(destRect, wbCircle, sourceRect);
        writeableBmp.Invalidate();

My problem is instead of having one large circle I have several smaller circles filling the rectangle area at the top (see image):

EDIT 1: Based on @Rene response I've changed the code to

        imgCat.Source = writeableBmp;

        //Just to make sure the boundary is correct so I draw the green rec around the object
        writeableBmp.DrawRectangle(AnsX1, AnsY1, AnsX2, AnsY2, Colors.Green);
        WriteableBitmap wbCircle = new WriteableBitmap(0, 0).FromContent("Images/circle.png");
        wbCircle = wbCircle.Resize(AnsX2 - AnsX1, AnsY2 - AnsY1, WriteableBitmapExtensions.Interpolation.Bilinear);

        Rect sourceRect = new Rect(0, 0, writeableBmp.PixelWidth, writeableBmp.PixelHeight);
        Rect destRect = new Rect(AnsX1, AnsY1, AnsX2 - AnsX1, AnsY2 - AnsY1);

        writeableBmp.Blit(destRect, wbCircle, sourceRect);
        writeableBmp.Invalidate();

Here's the result

I will use a larger and better quality circle.png if I manage to fix this.

Answer 1

First I think the circle.png is too small. The Blit method does not scale up. You would need to scale it up first using the Scale function like so:

wbCircle = wbCircle.Resize(AnsX2 - AnsX1, AnsY2 - AnsY1, WriteableBitmapExtensions.Interpolation.Bilinear);

And second the sourceRect uses the size of the whole / destination bitmap and not that of the wbCircle / source bitmap. Should be:

sourceRect = new Rect(0, 0, wbCircle.PixelWidth, wbCircle.PixelHeight);

The scaling could lead to some scaling artifacts if circle is too small and the up scaling is too high. If you really only need a simple colored circle, you can also use the DrawCircle method instead:

writeableBmp.DrawCircle(AnsX1, AnsY1, AnsX2, AnsY2, Colors.Green);