CustomSeries QML Type

El tipo CustomSeries permite presentar tipos de gráficos personalizados. Más...

• Lista de todos los miembros, incluidos los heredados

Propiedades

• delegate : Component

Métodos

• 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)

Descripción detallada

Utilice CustomSeries para crear gráficos personalizados. Piense en ello como un gráfico de dispersión que le permite acceder a datos personalizados para cada elemento.

CustomSeries define un delegado que se utiliza para representar cada elemento añadido al gráfico. Cada elemento incluye datos definidos por el usuario almacenados en QVariantMap. El índice del elemento en el gráfico también se añade automáticamente al mapa de datos. En el contexto QML, el mapa de variantes se define mediante un objeto JavaScript. La serie pasa este mapa a cada elemento creado en función del delegado. El delegado determina cómo utilizar los datos.

Para asignar datos a las coordenadas de renderización definidas por los ejes GraphsView, utilice las funciones mapX y mapY.

El siguiente código implementa el gráfico personalizado representado. En este caso los datos personalizados contienen dos valores: superior e inferior. Estos se definen en el delegado para afectar a la altura y a la coordenada y del elemento.

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

Documentación de propiedades

delegate : Component

El delegado se utiliza para insertar en QML elementos correspondientes a los datos personalizados proporcionados. Los datos se definen en el propio CustomSeries y se proporcionan a los elementos delegados a través de la propiedad "data".

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

Documentación del método

void append()

Añade un dato vacío a la serie.

void append(var data)

Añade un dato definido por data a la serie.

void clear()

Borra todos los datos.

void insert(int index)

Añade un dato vacío a la serie en la posición index.

void insert(int index, var data)

Añade un dato definido por data a la serie en la posición index.

real mapX(real x)

Devuelve x coordenada eje-espacio convertida a render-espacio.

real mapY(real y)

Devuelve y coordenada eje-espacio convertida a render-espacio.

void remove(int index)

Eliminar un elemento de datos en la posición index.