CustomSeries QML Type

Der Typ „CustomSeries“ ermöglicht die Darstellung benutzerdefinierter Diagrammtypen. Mehr...

• Liste aller Mitglieder, einschließlich geerbter Mitglieder

Eigenschaften

• delegate : Component

Methoden

• void append()
• void append(var data)
• void clear()
• void insert(int index)
• void insert(int index, var data)
• real mapX(real x)
• real mapY(real y)
• void remove(int index)

Ausführliche Beschreibung

Verwenden Sie „CustomSeries“, um benutzerdefinierte Diagramme zu erstellen. Stellen Sie sich dies als ein Streudiagramm vor, mit dem Sie auf benutzerdefinierte Daten für jedes Element zugreifen können.

„CustomSeries“ definiert einen Delegaten, der zum Rendern jedes zum Diagramm hinzugefügten Elements verwendet wird. Jedes Element enthält benutzerdefinierte Daten, die in einer „ QVariantMap “ gespeichert sind. Der Index des Elements im Diagramm wird ebenfalls automatisch zur Datenkarte hinzugefügt. Im QML-Kontext wird die Variantenkarte durch ein JavaScript-Objekt definiert. Die Serie übergibt diese Karte an jedes Element, das auf Basis des Delegaten erstellt wird. Der Delegat legt fest, wie die Daten verwendet werden.

Um Daten den durch die Achsen des „ GraphsView “ definierten Darstellungskoordinaten zuzuordnen, verwenden Sie die Funktionen „ mapX “ und „ mapY “.

Der folgende Code implementiert das abgebildete benutzerdefinierte Diagramm. In diesem Fall enthalten die benutzerdefinierten Daten zwei Werte: „upper“ und „lower“. Diese werden dann im Delegaten definiert, um die Höhe und die y-Koordinate des Elements zu beeinflussen.

import QtQuick
import QtGraphs

Window {
    width: 640
    height: 480
    visible: true

    GraphsView {
        anchors.fill: parent

        axisX: BarCategoryAxis {
            categories: ["ABC", "DEF"]
        }

        axisY: ValueAxis {
            max: 8
            tickInterval: 1
        }

        CustomSeries {
            id: custom

            delegate: Rectangle {
                property var data
                gradient: Gradient {
                    GradientStop { position: 0.0; color: "lightsteelblue" }
                    GradientStop { position: 1.0; color: "blue" }
                }
                border.width: 1
                x: custom.mapX(data.index + 0.5) - width * 0.5
                y: custom.mapY((data.upper + data.lower) * 0.5) - height * 0.5
                width: Math.abs(custom.mapX(1) - custom.mapX(0)) * 0.5
                height: Math.abs(custom.mapY(data.upper) - custom.mapY(data.lower))
            }

            CustomSeriesData {
                data: ({
                    upper: 5,
                    lower: 1
                })
            }

            CustomSeriesData {
                data: ({
                    upper: 6,
                    lower: 4
                })
            }
        }
    }
}

Dokumentation zu den Eigenschaften

delegate : Component

Der Delegate dient dazu, Elemente entsprechend den bereitgestellten benutzerdefinierten Daten in QML einzufügen. Die Daten werden im „ CustomSeries “ selbst definiert und über die Eigenschaft „data“ an die delegierten Elemente übergeben.

delegate: Rectangle {
        property var data
        Rectangle {
            color: "tan"
            border.color: "black"
            border.width: 4
            y: series.mapY(data.index + 1) - height / 2 + 1
            x: series.mapX(data.median) - width / 2
            height: 32
            width: Math.abs(series.mapX(data.upperQuartile) - series.mapX(data.lowerQuartile))
        }
    }
}

Methodendokumentation

void append()

Fügt der Reihe ein leeres Datenelement hinzu.

void append(var data)

Fügt der Reihe ein Datenelement hinzu, das durch „ data “ definiert ist.

void clear()

Alle Datenelemente löschen.

void insert(int index)

Fügt der Reihe an der Position index ein leeres Datenelement an.

void insert(int index, var data)

Fügt der Reihe an der Position index ein Datenelement hinzu, das durch data definiert ist.

real mapX(real x)

Gibt die in den Render-Raum umgerechnete Koordinate des Achsenraums „ x “ zurück.

real mapY(real y)

Gibt die in den Render-Raum umgerechnete Koordinate der Achse „ y “ zurück.

void remove(int index)

Entferne ein Datenelement an der Position index.