Integrate 3D Surface Chart control in WPF application

Applies to: Nevron Chart for .NET

How to integrate 3D Surface Chart control in WPF application?

All the charting types of Nevron Chart for .NET can be used in WPF applications. You can use the Chart control in WPF applications through WinForm Control Hosting (WindowsFormsHost). The following example will help you create a Triangulated Surface Chart in WPF:



Create a new WPF application:
  1. Open Microsoft Visual Studio for .NET
  2. Select the File - New - Project command - the new project dialog will be displayed
  3. Select Visual C# Projects (or Visual Basic) - WPF Applications
    Note: VS 2010 users must switch the target framework to ".NET Framework 4" as by default the applications target ".NET Framework 4 Client Profile". This is required, because Nevron Chart for WinForms uses design time support features that are not present in ".NET Framework 4 Client Profile". To do this right click on the project in Solution Explorer and select properties. On the Application tab go to "Target Framework" and select ".NET Framework 4".
  4. Click the OK button - the designer for MainWindow.xaml should automatically appear
  5. From the Visual Studio Toolbox, drag and drop a Windows Forms Host control (WindowsFormsHost) on the Main Window. This should add the following code:
  6. <Window x:Class="WpfApplication1.MainWindow"
            Title="MainWindow" Height="400" Width="500">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="154*" />
                <RowDefinition Height="157*" />
            </Grid.RowDefinitions>
            <WindowsFormsHost Height="Auto" HorizontalAlignment="Stretch" Name="windowsFormsHost1" VerticalAlignment="Stretch" Width="Auto" Grid.RowSpan="2" />
        </Grid>
    </Window>

    Note that for this example, we have set the Height and Width to Auto.

  7. In the project Solution Explorer, add reference to the following assemblies: Nevron.Chart.dll; Nevron.Chart.WinForm.dll; Nevron.Presentation.dll; Nevron.System.dll;
  8. In the MainWindow.xaml.cs use the following code:

[C#]
using System;
using System.Windows;
using Nevron.Chart;
using Nevron.Chart.WinForm;
using Nevron.GraphicsCore;
...
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
 
        NChartControl nChartControl1 = new NChartControl();
        nChartControl1 = new NChartControl();
        nChartControl1.Controller.Tools.Add(new NSelectorTool());
        nChartControl1.Controller.Tools.Add(new NTrackballTool());
 
        nChartControl1.Legends[0].Mode = LegendMode.Disabled;
 
        NCartesianChart chart = (NCartesianChart)nChartControl1.Charts[0];
        chart.Enable3D = true;
        chart.Width = 60;
        chart.Depth = 60;
        chart.Height = 30;
        chart.Projection.Type = ProjectionType.Perspective;
        chart.Projection.Elevation = 30;
        chart.Projection.Rotation = -60;
        chart.BoundsMode = BoundsMode.Fit;
        chart.LightModel.SetPredefinedLightModel(PredefinedLightModel.NorthernLights);
 
        // set chart wall visibility to auto
        chart.Wall(ChartWallType.Back).VisibilityMode = WallVisibilityMode.Auto;
        chart.Wall(ChartWallType.Left).VisibilityMode = WallVisibilityMode.Auto;
        chart.Wall(ChartWallType.Front).VisibilityMode = WallVisibilityMode.Auto;
        chart.Wall(ChartWallType.Right).VisibilityMode = WallVisibilityMode.Auto;
        chart.Wall(ChartWallType.Floor).VisibilityMode = WallVisibilityMode.Auto;
        chart.Wall(ChartWallType.Top).VisibilityMode = WallVisibilityMode.Auto;
 
        // set axis anchoring to auto
        chart.Axis(StandardAxis.PrimaryY).Anchor = new NBestVisibilityAxisAnchor(AxisOrientation.Vertical);
        chart.Axis(StandardAxis.PrimaryX).Anchor = new NBestVisibilityAxisAnchor(AxisOrientation.Horizontal);
        chart.Axis(StandardAxis.Depth).Anchor = new NBestVisibilityAxisAnchor(AxisOrientation.Depth);
 
        NTriangulatedSurfaceSeries triangulatedSurface = new NTriangulatedSurfaceSeries();
        chart.Series.Add(triangulatedSurface);
        triangulatedSurface.UsePreciseGeometry = true;
        triangulatedSurface.AutomaticPalette = true;
        triangulatedSurface.SyncPaletteWithAxisScale = false;
        triangulatedSurface.PaletteSteps = 8;
        triangulatedSurface.FrameMode = SurfaceFrameMode.Mesh;
 
        for (int j = 0; j < 30; j++)
        {
            for (int i = 0; i < 30; i++)
            {
                double yPoint = Math.Sin(i * 0.1) * Math.Cos(j * 0.1) * 5;
 
                triangulatedSurface.XValues.Add(i);
                triangulatedSurface.ZValues.Add(j);
                triangulatedSurface.Values.Add(yPoint);
            }
        }
 
        windowsFormsHost1.Child = nChartControl1;
    }
}

[VB.NET]
Imports System
Imports System.Windows
Imports Nevron.Chart
Imports Nevron.Chart.WinForm
Imports Nevron.GraphicsCore
...
Class MainWindow
    Public Sub New()
        InitializeComponent()
 
        Dim nChartControl1 As New NChartControl()
        nChartControl1 = New NChartControl()
        nChartControl1.Controller.Tools.Add(New NSelectorTool())
        nChartControl1.Controller.Tools.Add(New NTrackballTool())
 
        nChartControl1.Legends(0).Mode = LegendMode.Disabled
 
        Dim chart As NCartesianChart = DirectCast(nChartControl1.Charts(0), NCartesianChart)
        chart.Enable3D = True
        chart.Width = 60
        chart.Depth = 60
        chart.Height = 30
        chart.Projection.Type = ProjectionType.Perspective
        chart.Projection.Elevation = 30
        chart.Projection.Rotation = -60
        chart.BoundsMode = BoundsMode.Fit
        chart.LightModel.SetPredefinedLightModel(PredefinedLightModel.NorthernLights)
 
        ' set chart wall visibility to auto
        chart.Wall(ChartWallType.Back).VisibilityMode = WallVisibilityMode.Auto
        chart.Wall(ChartWallType.Left).VisibilityMode = WallVisibilityMode.Auto
        chart.Wall(ChartWallType.Front).VisibilityMode = WallVisibilityMode.Auto
        chart.Wall(ChartWallType.Right).VisibilityMode = WallVisibilityMode.Auto
        chart.Wall(ChartWallType.Floor).VisibilityMode = WallVisibilityMode.Auto
        chart.Wall(ChartWallType.Top).VisibilityMode = WallVisibilityMode.Auto
 
        ' set axis anchoring to auto
        chart.Axis(StandardAxis.PrimaryY).Anchor = New NBestVisibilityAxisAnchor(AxisOrientation.Vertical)
        chart.Axis(StandardAxis.PrimaryX).Anchor = New NBestVisibilityAxisAnchor(AxisOrientation.Horizontal)
        chart.Axis(StandardAxis.Depth).Anchor = New NBestVisibilityAxisAnchor(AxisOrientation.Depth)
 
        Dim triangulatedSurface As New NTriangulatedSurfaceSeries()
        chart.Series.Add(triangulatedSurface)
        triangulatedSurface.UsePreciseGeometry = True
        triangulatedSurface.AutomaticPalette = True
        triangulatedSurface.SyncPaletteWithAxisScale = False
        triangulatedSurface.PaletteSteps = 8
        triangulatedSurface.FrameMode = SurfaceFrameMode.Mesh
 
        For j As Integer = 0 To 29
            For i As Integer = 0 To 29
                Dim yPoint As Double = Math.Sin(i * 0.1) * Math.Cos(j * 0.1) * 5
 
                triangulatedSurface.XValues.Add(i)
                triangulatedSurface.ZValues.Add(j)
                triangulatedSurface.Values.Add(yPoint)
            Next
        Next
 
        windowsFormsHost1.Child = nChartControl1
    End Sub
End Class

Article ID: 171, Created On: 1/18/2011, Modified: 1/18/2011