Graphen in WPF C#-OxyPlot

Posted on by DamianLeave a comment

Graphen in WPF C#-OxyPlot

Fester Bestandteil der Arbeit an den Figuren ist ihre Analyse. Und welche Art von Daten wäre angenehmer für das Auge als das Diagramm? Deshalb der Eintrag wollte ein Werkzeug zum Zeichnen von Graphen in WPF C#-OxyPlot um diese Aufgabe zu erleichtern.

In Projekten, die die Anzeige von ein paar Punkte auf einfache Weise erfordern, kann dies mithilfe eigener Klassen erreicht werden. Manchmal jedoch die Menge der Daten erhöht und komplizierter Weg, um zB angezeigt wird. durch eine logarithmische Skala, die Fähigkeit, den Teil des Diagramms zu vergrößern. In diesen Situationen können die Programmierwerkzeuge einen signifikanten Anteil an den Zeitaufwand für das ursprüngliche Projekt übernehmen. Wert dann nutzen Sie die leistungsstarken Tools, die sicher sind, unsere Anforderungen erfüllen.

Auf dem Markt gibt es eine Reihe von Tools unterstützen die Anzeige von Diagrammen, zum Beispiel. XPlot, Chart, ZedGraph. Die meisten Tools ist in WinForms geschrieben und es glänzend. Was kann ich tun, wenn ein Projekt von Anfang bis zum Ende in WPF entworfen wurde? Sie können natürlich das WPF-Projekt mit WinForms kombinieren, aber es gibt ein Tool, das dieses Problem löst.

OxyPlot ist eine Bibliothek, die eine sofortige Umsetzung in WPF, Windows 8, Windows Phone, Windows Phone, Silverlight, Windows Forms, Silverlight, GTK #, Xwt, Xamarin. iOS, Xamarin. Android, Xamarin. Formen ermöglicht und Xamarin. Mac. Steht auf der MIT-Lizenz, die Sie frei verwenden kann, solange die Derivative Programme Content Lizenz eingereicht.

Wo beginnen

Mit der OxyPlot beginnen Ihre WPF-Projekt Bibliotheken hinzu. Es gibt drei Möglichkeiten, einen entsprechenden Verweis hinzufügen:

  1. Der einfachste Weg, dies zu tun ist, die Nuget zu verwenden. Beim Ausführen von Paket-Manager-Konsole Typ:

    • Install-Package Oxyplot. Kern
    • Wpf-Install-Package Oxyplot.

  2. Die zweite Möglichkeit ist für Bibliotheken Oxyplot. Kern und Oxyplot. Wpf Nuget Schnittstelle-verwalten Nuget Pakete in einer Weise, die unten dargestellt ist:Nuget-Charts in WPF C#-OxyPlot

  3. Die dritte Möglichkeit ist für diejenigen, die die bisherigen Möglichkeiten nicht funktionieren.

Mit dieser Methode können Sie verwenden, wenn ein Problem während der Installation aufgetreten ist, bestimmte Features funktionieren nicht OxyPlot oder aus irgendeinem Grund nicht wollen Nuget verwenden.

HINWEIS

Sowohl die Beschreibung und die Beispiele des Herstellers beziehen sich auf Version 2013.1.38.1, leider die Version derzeit in die Nuget ist ein 2014.1.546 und kann zu Fehlern führen. Eine davon ist:

Der Name „Plot“ ist im Namespace ‚http://oxyplot.codeplex.com‘ nicht vorhanden.

Die Lösung dieses Problems besteht darin, einen Verweis auf eine ältere Version von Dateien hinzufügen, die Sie hier herunterladen können: OxyPlot

Die heruntergeladene Datei sollte entpackt werden und dann fügen Sie einen Verweis darauf, wie unten dargestellt.

  1. Im Projektmappen-Explorer sollten Sie einen Verweis zu finden, mit der rechten Maustaste und wählen Sie Verweis hinzufügen.Bezug1-Charts in WPF C#-OxyPlot
  2. Klicken Sie im neuen Fenster, das geöffnet wird auf Durchsuchen und suchen Sie heruntergeladenen Dateien und dann auf hinzufügen.
    ref2-Charts in WPF C#-OxyPlot
  3. Schließlich sollten Sie prüfen, ob sie in der Liste ausgewählt sind, und klicken Sie auf OK.
    ref3-Charts in WPF C#-OxyPlot

HINWEIS

Fügen Sie alle Dateien von Nuget Dateien auf eine neuere Version aktualisiert werden. Im Falle des Auftretens der genannten zuvor wird es Fehler wieder.

Erklärung der Chart-Steuerelemente

Kontrolle muss im XAML-Code in Ihrem Projekt deklariert werden. In der Kopfzeile des Fensters müssen Sie die folgende Zeile hinzufügen:

Xmlns: autogen = "http://oxyplot.codeplex.com"

Geben Sie an der Stelle, wo das Diagramm angezeigt werden soll den Code:

<oxy:Plot x:name="Plot1" title="A Graph" model="{Binding PlotModel}" margin="10" grid.row="1"></oxy:Plot>

Der Wert der Erklärung hier ist das Modell, das in der Bindung festgelegt wurde. Dies ist ein Parameter, der Sie aussehen, Farbe, Palette, Datenreihen usw. festlegen kann.

OxyPlot trotz WPF und Bindowanego Model’u unterstützt nicht vollständig model MVVM (Model-View-ViewModel). Dies bedeutet, dass die Display-Änderungen im Diagramm aktualisieren der Daten in das Objekt PlotModel im Code-Behind.

Die Umsetzung des Objektdiagramms PlotModel

Nun, dass das Projekt bereits leichte, das zeigt ein Diagramm, die Sie ihr Aussehen kümmern müssen.

Das Modell die Bindung festgelegt wurde, und so es die Deklaration der Klasse auf das Feld ist, ist die Änderung induzierte Reaktion über Accessoren. Diese Klasse erbt von INotifyPropertyChanged und OnPropertyChanged-Methode zu überschreiben:

publicclass OxyPlotModel: INotifyPropertyChanged
{

    Private OxyPlot. PlotModel PlotModel;
    öffentliche OxyPlot. PlotModel-PlotModel
    {
        Erhalten
        {
            Rückkehr PlotModel;
        }
        Satz
        {
            PlotModel = Value; OnPropertyChanged ("PlotModel");
        }
    }

    öffentliche Veranstaltung PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged (String Name)
    {
        PropertyChangedEventHandler-Handler = PropertyChanged;
        Wenn (Handler! = Null)
        {
            Handler (dieser, neuen PropertyChangedEventArgs (Name));
        }
    }
}

Objekt, wie eine benutzerdefinierte Klasse in die Schnittstelle der Regelkarte Haken sollte.

Die Deklaration des Objekts
Private OxyPlotModel OxyPlotModel;

Im Konstruktor
OxyPlotModel = new OxyPlotModel ();
Dies. DataContext = OxyPlotModel;  Es erlaubt Ihnen, Indikatoren für Klassenfelder OxyPlotModel kombinieren

Festlegen der Parameter für das Diagramm

Wenn alles miteinander verbunden ist, bleibt es jetzt relevanten Parameter, die die PlotModel festlegen. Zu diesem Zweck wird die OxyPlotModel-Klasse erweitert. Wie diese Parameter nachzufüllen ist beliebig, aber im folgenden Beispiel hat dies in zwei Phasen getrennt worden. Parameter, die sich nicht ändern effektvoll zu Beginn, und diejenigen, die das Diagramm abhängig werden vor der Anzeige hinzugefügt. Feste Parameter hier sind nur diejenigen auf der Legende des Diagramms:

private void SetUpLegend)
{
    PlotModel. LegendTitle = "Legend";
    PlotModel. LegendOrientation = OxyPlot.LegendOrientation.Horizontal; Horizontale Ausrichtung
    PlotModel. LegendPlacement = OxyPlot.LegendPlacement.Outside; Neben spielen Diagramm
    PlotModel. LegendPosition = OxyPlot.LegendPosition.TopRight; Funktion: oben rechts
    PlotModel. LegendBackground = OxyPlot.OxyColor.FromAColor (200, OxyPlot.OxyColors.White)//white Hintergrund
    PlotModel. LegendBorder = OxyPlot.OxyColors.Black; Schwarzen Fensterrahmen
}

Ich empfehle keiner ersten Presseerklärung einer Achse, weil es sein kann, einen numerischen Wert aus der Deklaration und mit gleich Eingabedaten auf Überlappung und verursachen eine visuelle durcheinander.

Die zweite Methode einer Klasse, die aufgerufen wird, wenn Sie den Inhalt des Diagramms ändern. Das einfachste Beispiel Kosinusoidę-Methode gezeichnet wird aufgerufen:

public void PodajDaneDoWykresu)
{
        Dies. MyModel neue PlotModel = {Title = "Beispiel 1"};
        Dies. MyModel.Series.Add (neue FunctionSeries (Math Cos., 0, 10, 0.1, "cos (X)"));
}

Im Falle der Grafik basierend auf Ihre Punkte X und Y würde die gleiche Klasse wie folgt aussehen:

öffentliche IList<OxyPlot.DataPoint> verweist {Get; Set private;}</OxyPlot.DataPoint>
public void PodajDaneDoWykresu)
{
    this.plotModel.Title = "Beispiel 2";
    Dies. Punkte = neue Liste<OxyPlot.DataPoint></OxyPlot.DataPoint>
    {
            neue OxyPlot. DataPoint (5, 3)
            neue OxyPlot. DataPoint (15, 17)
            neue OxyPlot. DataPoint (25, 12),
            neue OxyPlot. DataPoint (35),
            neue OxyPlot. DataPoint (45, 15),
            neue OxyPlot. DataPoint (55)
    };
}

oder:

OxyPlot.Series.LineSeries PunktySerii;
public void PodajDaneDoWykresu)
{
    this.plotModel.Title = "Beispiel 3";

    punktySerii.Points.Add (neue OxyPlot. DataPoint (5, 3));
    punktySerii.Points.Add (neue OxyPlot. DataPoint (15, 17));
    punktySerii.Points.Add (neue OxyPlot. DataPoint (25, 12));
    punktySerii.Points.Add (neue OxyPlot. DataPoint (35, 4));
    punktySerii.Points.Add (neue OxyPlot. DataPoint (45, 15));
    punktySerii.Points.Add (neue OxyPlot. DataPoint (55, 10));

    plotModel.Series.Add (PunktySerii);
}

Darüber hinaus kann diese Methode durch Informationen über die Diagramm-Achsen-Parameter wie linear/logarithmisch, den Datenbereich, der Wert der Min/Max ergänzt werden:

Var xAxis = neue OxyPlot.Axes.LinearAxis (OxyPlot. Achsen. AxisPosition. unten, "Verkehr angebot[Erl]en") {MajorGridlineStyle = OxyPlot.LineStyle.Solid, MinorGridlineStyle = OxyPlot.LineStyle.Dot};
plotModel.Axes.Add (xAxis);
Var yAxis = neue OxyPlot.Axes.LogarithmicAxis (OxyPlot. Achsen. AxisPosition Links, "Ei") {MajorGridlineStyle = OxyPlot.LineStyle.Solid, MinorGridlineStyle = OxyPlot.LineStyle.Dot};
plotModel.Axes.Add (yAxis);

Wenn die Datenreihen mehr würde dann es deutlich voneinander abweichen so dass Sie eine Reihe von Parametern definieren sollten:

außerhalb der Deklaration der Methode
OxyPlot.Series.LineSeries PunktySerii;

Umsetzung in der
PunktySerii = neue OxyPlot.Series.LineSeries
{
    MarkerType = OxyPlot.MarkerType.Plus,//oznaczenie Punkte
    MarkerSize = 4, / / Größe der Punkte
    MarkerStroke = OxyPlot.OxyColors.Tomato,//Kolor Diagrammlinien
    Titel = "" //series Titel            
};

Sammeln alle Informationen, die unten besprochen wurde den Code für eine Datenreihe dargestellt, wie in der Liste dargestellt:

public void PodajDaneDoWykresu (List<double> X, List<double> Y) //Lista X und Y als Parameter an eine Methode</double> </double>
{
    this.PlotModel = new OxyPlot.PlotModel();
    //Entfernen die eingestellten Parameter aus der vorherigen run-Methode
    plotModel.Series = new System.Collections.ObjectModel.Collection<OxyPlot.Series.Series> { };
    plotModel.Axes = new System.Collections.ObjectModel.Collection<OxyPlot.Axes.Axis> { };


    //Grafisches Diagrammeinstellungen
    punktySerii = new OxyPlot.Series.LineSeries
    {
        MarkerType = ksztaltPunktowWykresu[0], //oznaczenie punktów - definicja poniżej
        MarkerSize = 4, //wielkość punktów
        MarkerStroke = koloryWykresow[0], //Kolor linii wykresu - definicja poniżej
        Title = "Seria nr: " + (1).ToString() //tytuł serii
    };

    //Daten-Ergänzung
    for (int n = 0; n < X.Count; n++)
        punktySerii.Points.Add(new OxyPlot.DataPoint(X[n], Y[n]));//dodanie wszystkich serii do wykresu
    
    plotModel.Series.Add(punktySerii);
    

    //Beschreibung und Diagramm Achse Parameter
    var xAxis = new OxyPlot.Axes.LinearAxis(OxyPlot.Axes.AxisPosition.Bottom, "a - offered traffic [Erl]") { MajorGridlineStyle = OxyPlot.LineStyle.Solid, MinorGridlineStyle = OxyPlot.LineStyle.Dot};
    plotModel.Axes.Add(xAxis);
    var yAxis = new OxyPlot.Axes.LogarithmicAxis(OxyPlot.Axes.AxisPosition.Left, "Ei") { MajorGridlineStyle = OxyPlot.LineStyle.Solid, MinorGridlineStyle = OxyPlot.LineStyle.Dot};
    plotModel.Axes.Add(yAxis);           
}

In den obigen Code hinzugefügt eine Reihe aufeinanderfolgende Werte Arrays KsztaltPunktowWykresu und KoloryWykresow. Dies ist eine Liste dieser Parameter die Werte der Studie um diese in einer Schleife verwenden können. Beispielimplementierung solche Arrays wird unten gezeigt:

Aufgeführten, um die Farbe und die Form der Number-Klasse ändern.
Private Readonly Liste<OxyPlot.OxyColor> KoloryWykresow = neue Liste<OxyPlot.OxyColor> </OxyPlot.OxyColor> </OxyPlot.OxyColor>
                                    {
                                        OxyPlot.OxyColors.Green,
                                        OxyPlot.OxyColors.IndianRed,
                                        OxyPlot.OxyColors.Coral,
                                        OxyPlot.OxyColors.Chartreuse,
                                        OxyPlot.OxyColors.Peru
                                    };
Private Readonly Liste<OxyPlot.MarkerType> KsztaltPunktowWykresu = neue Liste<OxyPlot.MarkerType> </OxyPlot.MarkerType> </OxyPlot.MarkerType>
                                            {
                                                OxyPlot.MarkerType.Plus,
                                                OxyPlot.MarkerType.Star,
                                                OxyPlot.MarkerType.Cross,
                                                OxyPlot.MarkerType.Custom,
                                                OxyPlot.MarkerType.Square
                                            };

Der Eintrag des Diagramms in eine Datei

Musst du ja Napracowaliśmy ein Diagramm anzeigen, wäre es schön, dass es in Form einer Datei für die spätere Wiedergabe zu halten. OxyPlot können Sie die Tastatur Tastenkombination Strg + c, sein Bild im temporären Speicher zu speichern, dann fügen ihn einfach in einem beliebigen Bildeditor verwenden.

Eine bequemere Möglichkeit ist jedoch die Verwendung einer Methode, die Ihnen erlaubt, in eine Datei schreiben:

OxyPlot. Wpf. PngExporter. Export (PlotModel, Dateiname, 1600, 1600, OxyPlot.OxyColors.White, 96);

Die Parameter dieser Methode:

  • Das Objektmodell des Diagramms;
  • Der Name der Datei, sowie die Lage und Ausdehnung;
  • Breite in Pixeln;
  • Die Höhe in Pixel;
  • Die Hintergrundfarbe des Diagramms;
  • Die Anzahl der Pixel pro Zoll;
Loading Facebook Comments ...

Schreibe einen Kommentar

Or