チュートリアル: イベントによるグラフのカスタマイズ
このチュートリアルでは、イベントを使用してグラフをカスタマイズする方法について説明します。最大のデータ ポイントにカスタム マーカーを追加して、今年最高の売り上げを示した販売員を強調表示します。
このチュートリアルを実行するには、「チュートリアル: グラフからデータベースへのデータ バインド」のチュートリアルを完了している必要があります。
グラフ名前空間の追加
最初に、ASP.NET アプリケーションの分離コード ファイルを開くか、または Windows フォーム アプリケーションのコード ビューに切り替えます。
コード ファイルの上部に、次のようにグラフ名前空間を追加します。
' For Windows Forms
Imports System.Windows.Forms.DataVisualization.Charting
' For ASP.NET
Imports System.Web.UI.DataVisualization.Charting
// For Windows Forms
using System.Windows.Forms.DataVisualization.Charting;
// For ASP.NET
using System.Web.UI.DataVisualization.Charting;
PostPaint イベントの追加
Chart.PostPaint イベントのイベント ハンドラーを追加します。
Windows フォームの場合は、フォームのコンストラクターで InitializeComponent メソッドの直後に行います。ASP.NET の場合は、自動的に作成される Page_Load イベント ハンドラー メソッドで行います。
AddHandler Me.Chart1.PostPaint, AddressOf Chart1_PostPaint
this.Chart1.PostPaint += new EventHandler<ChartPaintEventArgs>(Chart1_PostPaint);
次に、登録したイベント ハンドラーのメソッド定義を追加します。それには、次のコードをクラス定義に追加します。
Private Sub Chart1_PostPaint(ByVal sender As Object, ByVal e As ChartPaintEventArgs)
End Sub
void Chart1_PostPaint(object sender, ChartPaintEventArgs e)
{
}
カスタム描画の実行
今年最高の売り上げを示した販売員を強調表示するカスタム コードを追加します。それには、作成した Chart1_PostPaint イベント ハンドラーの下にコードを追加し、ファイルを保存し、アプリケーションを実行します。
' Make sure all series have been drawn before proceeding
If TypeOf e.ChartElement Is Series AndAlso DirectCast(e.ChartElement, Series).Name = "Series2" Then
Dim s As Series = e.Chart.Series(0)
Dim cg As ChartGraphics = e.ChartGraphics
Dim max As Double = s.Points.FindMaxByValue().YValues(0)
' Highlight the maximum sales this year
For i As Integer = 0 To s.Points.Count - 1
If s.Points(i).YValues(0) = max Then
' Get relative coordinates of the data point
Dim pos As System.Drawing.PointF = System.Drawing.PointF.Empty
pos.X = CSng(cg.GetPositionFromAxis("ChartArea1", AxisName.X, i+1))
pos.Y = CSng(cg.GetPositionFromAxis("ChartArea1", AxisName.Y, max))
' Convert relative coordinates to absolute coordinates.
pos = cg.GetAbsolutePoint(pos)
' Draw concentric circles at the data point
For radius As Integer = 10 To 39 Step 10
cg.Graphics.DrawEllipse(System.Drawing.Pens.Red, _
CSng(pos.X - radius / 2), _
CSng(pos.Y - radius / 2), radius, radius)
Next
End If
Next
End If
// Make sure all series have been drawn before proceeding
if (e.ChartElement is Series && ((Series)e.ChartElement).Name == "Series2" )
{
Series s = e.Chart.Series[0];
ChartGraphics cg = e.ChartGraphics;
double max = s.Points.FindMaxByValue().YValues[0];
// Highlight the maximum sales this year
for(int i = 0; i < s.Points.Count; i++)
{
if(s.Points[i].YValues[0] == max)
{
// Get relative coordinates of the data point
System.Drawing.PointF pos = System.Drawing.PointF.Empty;
pos.X = (float)cg.GetPositionFromAxis("ChartArea1", AxisName.X, i);
pos.Y = (float)cg.GetPositionFromAxis("ChartArea1", AxisName.Y, max);
// Convert relative coordinates to absolute coordinates.
pos = cg.GetAbsolutePoint(pos);
// Draw concentric circles at the data point
for (int radius = 10; radius < 40; radius += 10)
{
cg.Graphics.DrawEllipse(
System.Drawing.Pens.Red,
pos.X - radius / 2,
pos.Y - radius / 2,
radius, radius);
}
}
}
}
参照
関連項目
System.Windows.Forms.DataVisualization.Charting
System.Web.UI.DataVisualization.Charting