将C ++ QAbstractSeries添加到QML chartview

Question

I am having a hard time to work with c++ in combination with qml and QtCharts/Chartview. If there is any advice at any point, I am happy to here it!

Question: I would like to add a QLineSeries defined in c++ to Chartview in QML. My main problem is to connect my c++class setLineSeries() to my qml Chartview{} Object.

I tried to do this by creating a new series with

var series = diabBig.createSeries(ChartView.SeriesTypeLine, "Test", diabBig.axisX(lineseries), diabBig.axisY(lineseries));

and than change this series object to my c++QLineSeriesObject

series = diabetesView.setLineSeries();

Is it even possible to do it like this or how would be the intended way to use my QLineSeries(QAbstractSeries) from c++?

EDIT: "If it's not possible what I am trying to do, this would be an acceptable answer even though it wouldn't be the one I wish to read!"

Here is my short, snippy example code:

diabChart.h

#ifndef DIABCHART_H
#define DIABCHART_H

#include <QtCharts/QChartView>
#include <QtCharts/QLineSeries>
#include <QtCharts/QDateTimeAxis>
#include <QtCharts/QCategoryAxis>
#include <QDateTime>
#include <QtQuick/QQuickPaintedItem>
#include <QColor>
#include <QObject>

QT_CHARTS_USE_NAMESPACE

class DiabChart : public QObject
{
    Q_OBJECT

public:
    explicit DiabChart(QObject *parent = 0);

    Q_INVOKABLE QAbstractSeries* setLineSeries();

};

#endif // DIABCHART_H

diabChart.cpp

#include "diabchart.h"
#include <QtCharts/QChartView>

QT_CHARTS_USE_NAMESPACE

Q_DECLARE_METATYPE(QAbstractSeries *)
Q_DECLARE_METATYPE(QAbstractAxis *)

DiabChart::DiabChart(QObject *parent)
    : QObject(parent)
{
    qRegisterMetaType<QAbstractSeries*>();
    qRegisterMetaType<QAbstractAxis*>();
}

QAbstractSeries* DiabChart::setLineSeries()
{
    QLineSeries *bloodSugarSeries = new QLineSeries();

    QPen penBloodSugar;
    penBloodSugar.setColor(QColor(34, 102, 102));
    penBloodSugar.setWidth(5);
    QDateTime xValue;
    xValue.setDate(QDate(2016,7,3));
    xValue.setTime(QTime(0,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 192.6);
    xValue.setTime(QTime(7,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 89);
    xValue.setTime(QTime(9,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 100);
    xValue.setTime(QTime(12,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 50);
    xValue.setTime(QTime(14,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 250);
    xValue.setTime(QTime(18,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 140);
    xValue.setTime(QTime(21,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 80);
    xValue.setTime(QTime(23,30));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 200);
    xValue.setDate(QDate(2016,7,4));
    xValue.setTime(QTime(0,0));
    bloodSugarSeries->append(xValue.toMSecsSinceEpoch(), 192.6);
    bloodSugarSeries->setPen(penBloodSugar);


    return bloodSugarSeries;
}

main.cpp

#include <QQmlApplicationEngine>
#include <QtWidgets/QApplication>
#include <QtCharts/QChartView>
#include <QtWidgets/QMainWindow>
#include <QtQuick/QQuickView>
#include <QApplication>

#include "diabchart.h"

QT_CHARTS_USE_NAMESPACE

int main(int argc, char *argv[])
{

    QApplication app(argc, argv);

    qmlRegisterType<DiabChart>("DiabChart", 1, 0, "DiabChart");


    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    return app.exec();
}

main.qml

import QtQuick 2.5
import QtQuick.Controls 1.4
import QtCharts 2.0
import DiabChart 1.0

ApplicationWindow {
    id: windowwindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")


    DiabChart{
        id: diabetesView
    }

    function addseries()
    {
        // var xyz = diabetesView.setLineSeries();

        var series = diabBig.createSeries(ChartView.SeriesTypeLine, "Test", diabBig.axisX(lineseries), diabBig.axisY(lineseries));
        series.append(0,50);
        series.append(4,130);

        series = diabetesView.setLineSeries();

        diabBig.update();
    }
    Column{
        Rectangle{
            id: infoArea1
            color: "green"
            width: windowwindow.width
            height: windowwindow.height *0.25

            MouseArea{
                anchors.fill: parent
                onClicked: addseries()
            }
        }
        ChartView{
            id: diabBig
            width: windowwindow.width
            height: windowwindow.height *0.75
            title: "Line"

            antialiasing: true

            ValueAxis{
                id: vlaueAxisX
                min: 0
                max: 24
                tickCount: 12
                labelFormat: "%2.0f:00"
            }
            ValueAxis{
                id: valueAxisY
                min:0
                max: 500
                tickCount: 50
            }

            LineSeries {
                id: lineseries
                axisX: vlaueAxisX
                axisY: valueAxisY
                name: "LineSeries"
                XYPoint { id: zero; x: 0; y: 192.6}
                XYPoint { id: first; x: 7; y: 89 }
                XYPoint { x: 9; y: 80 }
                XYPoint { x: 12; y: 30 }
                XYPoint { x: 14; y: 150 }
                XYPoint { x: 18; y: 40 }
                XYPoint { x: 21; y: 280 }
                XYPoint { id: last; x: 23.5; y: 200 }
                XYPoint { id: twentyfour; x: 24; y: 192.6}
            }
        }
    }
}

test.pro

TEMPLATE = app

QT += charts qml quick

CONFIG += c++11

SOURCES += main.cpp \
    diabchart.cpp

RESOURCES += qml.qrc

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH = #../Diabetes

# Default rules for deployment.
include(deployment.pri)

DISTFILES +=

HEADERS += diabchart.h

Answer 1

Instead of using the function like this QAbstractSeries* DiabChart::setLineSeries() I changed it to this: void DiabChart::setLineSeries(QLineSeries* lineSeries)

Function called to change ChartView input looks like this:

function addSeries()
{
    //Define Axes of the ChartView
    diabetesView.getAxisYDescription(yDescription);
    diabetesView.getAxisXTime(xTime);
    diabetesView.getAxisYValues(yValues);

    // Create new LineSeries with 3 Axes (Two-Y-Axis, One-X-Axis)
    var mySeries = diabChartBig.createSeries(ChartView.SeriesTypeLine, "Line", xTime, yValues);
    var mySeries2 = diabChartBig.createSeries(ChartView.SeriesTypeLine, "Overview", xTime, yDescription);

    // Define series on specific wishes
    diabetesView.setLineSeries(mySeries);

    //Delete not needed series (only created because second y-Axis
    diabChartBig.removeSeries(mySeries2);
}

and ChartView-Object with a minimum setup looks like this:

ChartView{
    id: diabChartBig
    title: "Overview"
    width: diabetesApplicationArea.width * 0.78
    height: diabetesApplicationArea.height * 0.66
    antialiasing: true
    backgroundColor: "grey"
    CategoryAxis{
        id: yDescription
    }
    DateTimeAxis{
        id: xTime
    }
    CategoryAxis{
        id: yValues
    }
}

Result looks like this: