Lernprogramm: Anpassen eines Diagramms mit Ereignissen

Dieses Lernprogramm veranschaulicht, wie Sie mithilfe von Ereignissen ein Diagramm anpassen.Sie fügen am Maximum-Datenpunkt eine benutzerdefinierte Markierung hinzu, um den Mitarbeiter mit dem höchsten Umsatz in diesem Jahr hervorzuheben.

Um dieses Lernprogramm durchführen zu können, müssen Sie zunächst das Lernprogramm: Datenbindung eines Diagramms an eine Datenbank bearbeiten.

Hinzufügen des Diagrammnamespace

Öffnen Sie zunächst die CodeBehind-Datei in der ASP.NET-Anwendung, oder wechseln Sie in der Windows Forms-Anwendung in die Codeansicht.

Fügen Sie oben in der Codedatei den Diagrammnamespace ein, wie unten dargestellt.

' 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;

Hinzufügen des PostPaint-Ereignisses

Fügen Sie einen Ereignishandler für das Chart.PostPaint-Ereignis hinzu.

In Windows Forms führen Sie dies im Konstruktor des Formulars nach der InitializeComponent-Methode durch.In ASP.NET führen Sie dies in der Page_Load-Ereignishandlermethode durch, die automatisch erstellt wird.

AddHandler Me.Chart1.PostPaint, AddressOf Chart1_PostPaint

this.Chart1.PostPaint += new EventHandler<ChartPaintEventArgs>(Chart1_PostPaint);

Fügen Sie dann die Methodendefinition für den Ereignishandler hinzu, den Sie gerade registriert haben.Fügen Sie dazu den folgenden Code in die Klassendefinition ein.

Private Sub Chart1_PostPaint(ByVal sender As Object, ByVal e As ChartPaintEventArgs) 
End Sub 

void Chart1_PostPaint(object sender, ChartPaintEventArgs e)
{
}

Ausführen von benutzerdefinierten Farbmarkierungen

Sie fügen nun benutzerdefinierten Code hinzu, mit dem der Vertriebsmitarbeiter hervorgehoben wird, der in diesem Jahr den höchsten Umsatz erzielt hat.Fügen Sie dazu dem Chart1_PostPaint-Ereignishandler, den Sie gerade erstellt haben, den unten aufgeführten Code hinzu, speichern Sie die Datei, und führen Sie die Anwendung aus:

' 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);
         }
      }
   }
}

Siehe auch

Referenz

System.Windows.Forms.DataVisualization.Charting

System.Web.UI.DataVisualization.Charting

Konzepte

Anpassung und Ereignisse

Weitere Ressourcen

Erste Schritte