Drawing circle on head - positioning problem RRS feed

  • Question

  • hey everyone

    I recently started testing the kinect in visual studio, and i wanted to make a small beginners program. I just want to draw an ellipse on the head of the player.

    I can draw the ellipse but it is not positioned where my head is, I think it has something to do with the Z index . Can someone help me ?

    code :

     void getCameraPoint(Skeleton first, AllFramesReadyEventArgs e)
                using (DepthImageFrame depth = e.OpenDepthImageFrame())
                    if (depth == null || KinectSensor.KinectSensors.Count == 0)
                        //map a joint location on the depth map
                    DepthImagePoint headDepthPoint = depth.MapFromSkeletonPoint(first.Joints[JointType.Head].Position);
                    drawEllipseOnHead(headDepthPoint.X, headDepthPoint.Y, 50, 50);
                    DepthImagePoint leftHandPoint = depth.MapFromSkeletonPoint(first.Joints[JointType.HandLeft].Position);
                    drawEllipseOnLeftHand(leftHandPoint.X, leftHandPoint.Y,20,20);
                    DepthImagePoint rightHandPoint = depth.MapFromSkeletonPoint(first.Joints[JointType.HandRight].Position);
                    drawEllipseOnRightHand(rightHandPoint.X, rightHandPoint.Y, 20, 20);

     void drawEllipseOnHead(int headPositionX, int headpositionY, int width, int height)
                // Create a red Ellipse.
                Ellipse myEllipse = new Ellipse();
                // Create a SolidColorBrush with a red color to fill the  
                // Ellipse with.
                SolidColorBrush mySolidColorBrush = new SolidColorBrush();
                // Describes the brush's color using RGB values.  
                // Each value has a range of 0-255.
                mySolidColorBrush.Color = Color.FromArgb(255, 255, 255, 0);
                myEllipse.Fill = mySolidColorBrush;
                myEllipse.StrokeThickness = 2;
                myEllipse.Stroke = Brushes.Black;
                // Set the width and height of the Ellipse.
                myEllipse.Width = width;
                myEllipse.Height = height;
                Canvas.SetLeft(myEllipse, headPositionX - width);
                Canvas.SetTop(myEllipse, headpositionY - height);

    thanks in advance !


    Tuesday, February 18, 2014 11:12 AM

All replies

  • Well the first thing that stands out to me is that when you set the left/top position of the ellipse - you shouldn't subtract the whole width or height, you should just subtract half of them. If the head was at X pos 250 and you subtract 50 - the head circle would be displayed at position 200-250, you just want to subtract half so that half the circle is on the left/top and the other half is on the right/bottom of that point.

    Tuesday, February 18, 2014 3:06 PM
  • yeah sorry, I originally did that. But then i changed it to try with full width substracted. Even if you substract half of the width it doesn't even come close to where it should be.

    Do I have to stand a certain distance away, in order to get good coordinates ?

    Greetings !


    Wednesday, February 19, 2014 7:50 AM
  • I guess the best place to start would be to look at 'KinectExplorer-WPF' project in the developer toolkit.  I noticed that you are using the deprecated MapFromSkeletonPoint on the depthframe.  You should be using the KinectSensor.CoordinateMapper instead to convert from one space to the other.

    I think if you look at the KinectSkeletonViewer file in the Microsoft.Samples.Kinect.WpfViewers project (specifically the Get2DPosition function). 

    That will give you a good idea on how to draw a skeleton/joint on either/both the color image as well as a depth image.

    switch (imageType)
                        case ImageType.Color:
                            if (ColorImageFormat.Undefined != colorFormat)
                                var colorPoint = sensor.CoordinateMapper.MapSkeletonPointToColorPoint(skeletonPoint, colorFormat);
                                // map back to skeleton.Width & skeleton.Height
                                return new Point(
                                    (int)(renderSize.Width * colorPoint.X / colorWidth),
                                    (int)(renderSize.Height * colorPoint.Y / colorHeight));
                        case ImageType.Depth:
                            if (DepthImageFormat.Undefined != depthFormat)
                                var depthPoint = sensor.CoordinateMapper.MapSkeletonPointToDepthPoint(skeletonPoint, depthFormat);
                                return new Point(
                                    (int)(renderSize.Width * depthPoint.X / depthWidth),
                                    (int)(renderSize.Height * depthPoint.Y / depthHeight));

    • Edited by kjwinkel Wednesday, February 19, 2014 1:00 PM
    Wednesday, February 19, 2014 12:59 PM
  • Nsmet,

    It sounds like you are drawing a depth outline to a bitmap while also drawing an ellipse to the canvas.

    If that's the case, the problem may be as simple as making sure your canvas and depth Image control have the same dimensions and are aligned properly.

    As a test, you can just manually adjust the size of your application window and see if there is a size where everything starts aligning the way you want.  Then work backwards from there.

    James Ashley - Presentation Layer Architect at Razorfish Emerging Experiences

    Wednesday, February 19, 2014 4:23 PM