As part of the NetAdvantage for WPF product, we already offer a substantial array of data visualization controls such as a high-speed chart, map, pivot grid, timeline, treemap and others. These have been applied to numerous applications displaying financial, geographical and OLAP data to produce interactive dashboards and rich data displays. Still, one of the missing pieces in the visualization capabilities has been a surface chart for visualizing three dimensional data. Over the past couple of months, we’ve built a WPF surface chart we’d like to get your feedback on. This control will not be supported until its official inclusion in the product. However, it contains the features and performance you need to start visualizing your 3D data today, and to do it for free with a prototype of the control.

This blogpost introduces the WPF surface chart, presents its API and illustrates its use with a sample project. This sample includes a DLL with the control itself, ready for use in your own applications. Please remember to unblock the ZIP archive before extracting it.The project is built using Visual Studio 2010 and .NET Framework 4. The sample project contains all the libraries it needs, so you can build and run it without any additional downloads.  Here’s a screenshot of the sample project:

In the sections below, the functionality of the control is presented together with its API.

How to use the sample

The sample shows 3D scatter data and a surface through these points. The surface contains contour lines to denote the level projections of Z-axis on the surface. The polygons composing the surface are colored according to their Z-value, and this coloring is projected on the XY plain. The color interval used for the coloring is displayed in a color legend control which appears next to the surface chart. You can customize the lighting, shininess and perspective using the sliders provided on the right. You can also test the performance of the 3D chart by starting the updates on the data by clicking the Update button. You can click and drag or use the arrow keys to rotate the surface, allowing you to get a better view of the data.

API

The API of this control has been designed for simplicity while implementing a wide range of features. It is built to share the color scale together with other data visualization controls.

Data Binding

Data binding is implemented through the standard mechanism which lets you bind the ItemsSource property to MVVM model properties. Once you’ve set the ItemsSource property, you can set the XMemberPath, YMemberPath and ValueMemberPath to properties containing the three components of the bound data. This approach is identical to the one used in the XamDataChart, as it was developed by the same team. You need to set the X, Y and Z axes through the XAxis, YAxis and ZAxis properties – linear and logarithmic scales are supported, as well as inverted axes. You can fully customize the labels and title styles as well as the minimum and maximum values displayed.

Formatting and Appearance

The surface chart gives you the full range of capabilities to control the axis value formatting and appearance of your data. Most styling properties not related to specific elements can be set at the control level

Interaction

The user can click and drag with the mouse or use the arrow keys to rotate the 3D chart.

Coloring

The surface chart supports two types of value scales  – Linear and Logarithmic. In the sample, we’re using the linear one. You’d typically use the Linear one when you don’t have a lot of variance between the values represented by the color, and the Logarithmic one when you do. The scales used for the coloring work just like chart axes with auto-ranging across multiple series or controls and with separately settable Minimum and Maximum values.

While at least two colors are required, more can be used. You can use this color scheme to build a choropleth view of your data. By having full control over the color scheme, you can easily implement sequential and diverging scales to adequately color your data – in the case of a diverging color scale, you’ll need to specify at least three colors.

Both of these value scales have the following properties:

Disclaimer

The control is freely available as a prototype that we’re using to gather feedback, and can be used without limitations in your commercial projects. Eventually, when a control implementing this functionality is added to our paid for product, it will be serviced and supported.

Summary

This blogpost presented a freely-available prototype (no further help and samples are available for this control at this time) version of a WPF surface chart, together with a sample illustrating data binding, axis customization and control styling. Even through this control isn’t a part of our NetAdvantage for WPF product, the surface chart has a number of features to enable you to effectively visualize your three-dimensional scatter data. I would recommend downloading this prototype, and demonstrating its capabilities to your users – they’ll be sure to think of data they’d like to have visualized using a surface chart, and you’ll be able to use this control to meet this requirement and add value to your application.

Please share any feedback you have regarding the features you’d like to see in this control on my email – kmatev@infragistics.com