PolarChartView QML Type

Presenta los datos en gráficos polares. Más...

• Lista de todos los miembros, incluidos los heredados

Descripción detallada

Los gráficos polares presentan datos en un gráfico circular, donde la colocación de los datos se basa en el ángulo y la distancia desde el centro del gráfico, el polo.

Un gráfico polar es una especialización del tipo ChartView. Admite series de líneas, splines, áreas y dispersión, así como todos los tipos de ejes que admiten. Cada eje puede utilizarse como eje radial o angular.

La primera y la última marca de graduación de un eje angular ValueAxis coinciden en un ángulo de 0/360 grados.

Si la distancia angular entre dos puntos consecutivos de una serie es superior a 180 grados, cualquier línea directa que conecte los dos puntos carece de sentido y no se dibujará. En su lugar, se dibujará una línea desde y hacia el centro del gráfico. Por lo tanto, los rangos de los ejes deben elegirse en consecuencia cuando se muestren series de líneas, splines o áreas.

Los gráficos polares dibujan todos los ejes de la misma orientación en la misma posición, por lo que utilizar varios ejes de la misma orientación puede resultar confuso, a menos que los ejes adicionales sólo se utilicen para personalizar la cuadrícula. Por ejemplo, puede mostrar un rango resaltado con un sombreado secundario CategoryAxis o proporcionar subticks sin etiquetar con un ValueAxis secundario que tenga etiquetas ocultas.

El siguiente código QML muestra cómo crear un gráfico polar con una spline y series de dispersión y dos ejes de valor:

PolarChartView {
    title: "Two Series, Common Axes"
    anchors.fill: parent
    legend.visible: false
    antialiasing: true

    ValueAxis {
        id: axisAngular
        min: 0
        max: 20
        tickCount: 9
    }

    ValueAxis {
        id: axisRadial
        min: -0.5
        max: 1.5
    }

    SplineSeries {
        id: series1
        axisAngular: axisAngular
        axisRadial: axisRadial
        pointsVisible: true
    }

    ScatterSeries {
        id: series2
        axisAngular: axisAngular
        axisRadial: axisRadial
        markerSize: 10
    }

    // Add data dynamically to the series
    Component.onCompleted: {
        for (var i = 0; i <= 20; i++) {
            series1.append(i, Math.random());
            series2.append(i, Math.random());
        }
    }
}