Draw a 3D heart using WPF and C#

[3D heart]

The post Draw a parametric heart-shaped curve in C# shows how you can draw a 2D heart for Valentine’s Day. This example draws and rotates a 3D heart.

The example is pretty complicated and contains a lot of tools that would take a long time to describe completely. It was one of the programs I was working on for my Kickstarter project .NET Graphics Programming Omnibus. I was going to work through all of the tools needed to get to this point, but since the project wasn’t funded, I’m going to skip them and just explain at a high level how this example works. You can download the code to see how the pieces fit together.



[3D heart]
The basic idea is that the program makes a sequence of heart-shaped polygons in three dimensions as shown in Figure 1. The program uses the equations described in the previous post to define the polygons’ X and Y coordinates.

The points’ Z coordinates (which move the points outward toward you in Figure 1) depend on each point’s distance from the nearest point on the polygon (ignoring the Z coordinates). The program basically sets ths Z coordinate equal to the square root of the distance to the point. For example, if the point is right next to the edge of the heart shape, the distance is 0 so the Z coordinate is 0. If the point is distance 1 from the edge of the heart, its Z coordinate is Sqrt(1) = 1. The shape of the square root function makes the top of the 3D heart curved.

After it generates the heart polygons, the program connects corresponding points on them to create strips between them. It triangulates the topmost heart to fill it in.

At this point the program has the shell of a 3D heart but it has no back. To create the back, the program makes a new mesh by reflecting the points across the X-Y plane. To do that it simply reverses the sign of each points Z coordinate.

Reflecting the points’ Z coordinates changes the orientation of the triangles that use the points, however. For example, if the triangle A-B-C was outwardly oriented, then the reflected points make the triangle A’-B’-C’ inwardly oriented. To fix that, the program rebuilds the new mesh’s triangles, reversing their orientation. In this example, the new triangle would be C’-B’-A’.

The program merges the meshes that define the 3D heart’s front and back sides. It then smooths the combined mesh so the edge between the two halves isn’t noticeable.



Figure 2 shows the combined mesh and Figure 3 shows the mesh with non-smoothed shading.


[3D heart][3D heart]



Figure 4 shows the finished result with smoothing. This figure uses 10 heart polygons (the previous figures used 5) each defined by 100 points (the previous figures used 10) to create a total of 7,396 triangles.


[3D heart]

That’s the basic approach. Download the example to see additional details.


Download Example   Follow me on Twitter   RSS feed   Donate




About RodStephens

Rod Stephens is a software consultant and author who has written more than 30 books and 250 magazine articles covering C#, Visual Basic, Visual Basic for Applications, Delphi, and Java.

This entry was posted in algorithms, drawing, graphics, mathematics, wpf and tagged , , , , , , , , , , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *