In This Topic
This topic describes the steps needed to create a simple ASP.NET Web Form application or Website project using the Nevron Chart ThinWeb control.
1. Open Microsoft Visual Studio .NET.
2. On the File / New Project select "Visual C# projects" and then select "ASP .NET Web application" from the list on the right side.
3. Click OK.
4. If the current page view is Source, switch to Design.
5. Open the Toolbox. If it's not visible open it from the View\Toolbox menu item.
6. Locate the Nevron Chart Web Form tab and expand it.
7. Select "NThinChartControl" and drop it on the form.
8. Check whether the following assemblies are referenced by the project:
- Nevron.System
- Nevron.Presentation
- Nevron.ThinWeb
- Nevron.Chart
- Nevron.Chart.ThinWeb
9. Check if the following configuration xml exists in your web.config file:
| web.config |
Copy Code
|
|
<system.web>
<httpHandlers>
<add path="NThinChartControlHttpHandler.axd" verb="*" type="Nevron.Chart.ThinWeb.NThinChartControlHttpHandler" validate="false" />
<add path="NAspNetThinWebControlHttpHandler.axd" verb="*" type="Nevron.ThinWeb.NAspNetThinWebControlHttpHandler" validate="false" />
</httpHandlers>
</system.web>
<system.webServer>
<handlers>
<remove name="NThinChartControlHttpHandler" />
<remove name="NAspNetThinWebControlHttpHandler" />
<add name="NThinChartControlHttpHandler" preCondition="integratedMode" verb="*" path="NThinChartControlHttpHandler.axd" type="Nevron.Chart.ThinWeb.NThinChartControlHttpHandler" />
<add name="NAspNetThinWebControlHttpHandler" preCondition="integratedMode" verb="*" path="NAspNetThinWebControlHttpHandler.axd" type="Nevron.ThinWeb.NAspNetThinWebControlHttpHandler" />
</handlers>
</system.webServer>
|
10. Open the source code for WebForm1.aspx - from the Solution explorer right click on Default.aspx and select "View code".
11. Modify the source code so that it looks like:
| C# |
Copy Code
|
|
using System;
using Nevron.Chart;
using Nevron.Chart.ThinWeb;
using Nevron.GraphicsCore;
using Nevron.ThinWeb;
namespace WebApplication1
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!NThinChartControl1.Initialized)
{
// enable jittering (full scene antialiasing)
NThinChartControl1.Settings.JitterMode = JitterMode.Enabled;
NThinChartControl1.BackgroundStyle.FrameStyle.Visible = false;
// by default the control contains a Cartesian chart -> remove it and create a Pie chart
NChart chart = new NPieChart();
NThinChartControl1.Charts.Clear();
NThinChartControl1.Charts.Add(chart);
// configure the chart
chart.Enable3D = true;
chart.LightModel.SetPredefinedLightModel(PredefinedLightModel.MetallicLustre);
chart.Projection.SetPredefinedProjection(PredefinedProjection.OrthogonalElevated);
// add a pie serires
NPieSeries pie = (NPieSeries)chart.Series.Add(SeriesType.Pie);
pie.PieStyle = PieStyle.SmoothEdgePie;
pie.PieEdgePercent = 50;
pie.DataLabelStyle.Visible = false;
pie.AddDataPoint(new NDataPoint(0, "Ships"));
pie.AddDataPoint(new NDataPoint(0, "Trains"));
pie.AddDataPoint(new NDataPoint(0, "Cars"));
pie.AddDataPoint(new NDataPoint(0, "Buses"));
pie.AddDataPoint(new NDataPoint(0, "Airplanes"));
pie.Values.FillRandomRange(new Random(), pie.Values.Count, 1, 20);
for (int i = 0; i < pie.Values.Count; i++)
{
pie.Detachments.Add(0);
}
// apply style sheet
NStyleSheet styleSheet = NStyleSheet.CreatePredefinedStyleSheet(PredefinedStyleSheet.NevronMultiColor);
styleSheet.Apply(NThinChartControl1.Document);
// configure the controller
NServerMouseEventTool serverMouseEventTool = new NServerMouseEventTool();
serverMouseEventTool.MouseDown = new NDetachPieSliceMouseEventCallback();
NThinChartControl1.Controller.Tools.Add(serverMouseEventTool);
}
}
[Serializable]
class NDetachPieSliceMouseEventCallback : INMouseEventCallback
{
#region INMouseEventCallback Members
public void OnMouseEvent(NAspNetThinWebControl control, NBrowserMouseEventArgs e)
{
NThinChartControl chartControl = (NThinChartControl)control;
NPieChart pieChart = (NPieChart)chartControl.Charts[0];
NHitTestResult hitTestResult = chartControl.HitTest(e.X, e.Y);
int dataPointIndex = hitTestResult.DataPointIndex;
// collapse all pie slices
NPieSeries pieSeries = (NPieSeries)pieChart.Series[0];
for (int i = 0; i < pieSeries.Values.Count; i++)
{
pieSeries.Detachments[i] = 0;
}
// expand the one that's hit
if (dataPointIndex != -1)
{
pieSeries.Detachments[dataPointIndex] = 5.0f;
}
chartControl.UpdateView();
}
#endregion
}
}
}
|
| Visual Basic |
Copy Code
|
|
Imports System
Imports Nevron.Chart
Imports Nevron.Chart.ThinWeb
Imports Nevron.GraphicsCore
Imports Nevron.ThinWeb
Namespace WebApplication1
Public Partial Class _Default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
If (Not NThinChartControl1.Initialized) Then
' enable jittering (full scene antialiasing)
NThinChartControl1.Settings.JitterMode = JitterMode.Enabled
NThinChartControl1.BackgroundStyle.FrameStyle.Visible = False
' by default the control contains a Cartesian chart -> remove it and create a Pie chart
Dim chart As NChart = New NPieChart()
NThinChartControl1.Charts.Clear()
NThinChartControl1.Charts.Add(chart)
' configure the chart
chart.Enable3D = True
chart.LightModel.SetPredefinedLightModel(PredefinedLightModel.MetallicLustre)
chart.Projection.SetPredefinedProjection(PredefinedProjection.OrthogonalElevated)
' add a pie serires
Dim pie As NPieSeries = CType(chart.Series.Add(SeriesType.Pie), NPieSeries)
pie.PieStyle = PieStyle.SmoothEdgePie
pie.PieEdgePercent = 50
pie.DataLabelStyle.Visible = False
pie.AddDataPoint(New NDataPoint(0, "Ships"))
pie.AddDataPoint(New NDataPoint(0, "Trains"))
pie.AddDataPoint(New NDataPoint(0, "Cars"))
pie.AddDataPoint(New NDataPoint(0, "Buses"))
pie.AddDataPoint(New NDataPoint(0, "Airplanes"))
pie.Values.FillRandomRange(New Random(), pie.Values.Count, 1, 20)
Dim i As Integer = 0
Do While i < pie.Values.Count
pie.Detachments.Add(0)
i += 1
Loop
' apply style sheet
Dim styleSheet As NStyleSheet = NStyleSheet.CreatePredefinedStyleSheet(PredefinedStyleSheet.NevronMultiColor)
styleSheet.Apply(NThinChartControl1.Document)
' configure the controller
Dim serverMouseEventTool As NServerMouseEventTool = New NServerMouseEventTool()
serverMouseEventTool.MouseDown = New NDetachPieSliceMouseEventCallback()
NThinChartControl1.Controller.Tools.Add(serverMouseEventTool)
End If
End Sub
<Serializable> _
Private Class NDetachPieSliceMouseEventCallback
Implements INMouseEventCallback
#Region "INMouseEventCallback Members"
Public Sub OnMouseEvent(ByVal control As NAspNetThinWebControl, ByVal e As NBrowserMouseEventArgs) Implements INMouseEventCallback.OnMouseEvent
Dim chartControl As NThinChartControl = CType(control, NThinChartControl)
Dim pieChart As NPieChart = CType(chartControl.Charts(0), NPieChart)
Dim hitTestResult As NHitTestResult = chartControl.HitTest(e.X, e.Y)
Dim dataPointIndex As Integer = hitTestResult.DataPointIndex
' collapse all pie slices
Dim pieSeries As NPieSeries = CType(pieChart.Series(0), NPieSeries)
Dim i As Integer = 0
Do While i < pieSeries.Values.Count
pieSeries.Detachments(i) = 0
i += 1
Loop
' expand the one that's hit
If dataPointIndex <> -1 Then
pieSeries.Detachments(dataPointIndex) = 5.0f
End If
chartControl.UpdateView()
End Sub
#End Region
End Class
End Class
End Namespace
|
12. Start the application - the page must display a clickable pie chart.
