将数据从 c++ 加载到 QML Scatter3d 项

Question

我正在尝试开发示例"qmlscatter"的修改版本，可在Qt示例中使用。我的目的是通过修改"Data.qml"文件的数据点，在 3D 环境中绘制飞行轨迹。飞行路径的实际坐标存储在三个不同的QVectorsQVector<double>"cogPosX_"，"cogPosY_"和"cogPosZ_"中，每个索引代表后一个时间步长。

正如论坛提到的，我需要使用".setContextProperty"函数来更新 QML 文件中的数据值。但是，我找不到真正找到如何让它工作的方法。我想主要原因是我没有引用正确的"数据模型"id。这里有我的代码：

datapointobject.h//这应该定义一个通用对象，其中包含每个数据点的 X Y 和 Z 坐标。

#ifndef DATAPOINTOBJECT_H
#define DATAPOINTOBJECT_H
#include <QWidget>
class DataObject : public QObject
{
Q_OBJECT
Q_PROPERTY(double x READ x WRITE setX)
Q_PROPERTY(double y READ y WRITE setY)
Q_PROPERTY(double z READ z WRITE setZ)
public:
DataObject(QObject* parent =0);//Constructor
DataObject(const double & x, const double & y, const double & z, QObject * parent=0);
~DataObject();//Destructor
double x() const;
double y() const;
double z() const;
void setX(const double &x);
void setY(const double &y);
void setZ(const double &z);
signals:
void xChanged();
void yChanged();
void zChanged();
private:
double m_x;
double m_y;
double m_z;
};
#endif // DATAPOINTOBJECT_H

datapointobject.cpp//这定义了构造函数和函数。

#include "datapointobject.h"
#include<QDebug>
DataObject::DataObject(QObject *parent)//Constructor
: QObject(parent)
{
}
DataObject::DataObject(const double &x, const double &y, const double &z, QObject *parent)//Constructor
:QObject(parent), m_x(x), m_y(y), m_z(z)
{
}
DataObject::~DataObject(){//Destructor
}
double DataObject::x() const
{
return m_x;
}
double DataObject::y() const
{
return m_y;
}
double DataObject::z() const
{
return m_z;
}
void DataObject::setX(const double &x){
if (x != m_x) {
m_x = x;
emit xChanged();
}
}
void DataObject::setY(const double &y){
if (y != m_y) {
m_y = y;
emit yChanged();
}
}
void DataObject::setZ(const double &z){
if (z != m_z) {
m_z = z;
emit zChanged();
}
}

threeDviewer.h//这个标头定义了 "Flightviewer" 类，该类创建一个 QQuickView 实例，负责绘制 3D 散射。

#ifndef FLIGHTVIEWER_H
#define FLIGHTVIEWER_H
#include <QtWidgets>
#include <QtGui/QGuiApplication>
#include <QtCore/QDir>
#include <QtQuick/QQuickView>
#include <QtQml/QQmlEngine>
#include "flight.h"
#include <QtQml>
class Flightviewer: public QWidget
{
Q_OBJECT
public:
Flightviewer(Flight displayedFlight, QString directory, QWidget *parent = 0);//Constructor
virtual ~Flightviewer();//Destructor
QQuickView viewer;
void showWindow();
void readFlightTrajectory(Flight flight);
};

#endif // FLIGHTVIEWER_H

threeDviewer.cpp//此文件配置QQuickView viewer实例。它负责将飞行数据导入QML数据文件。

#include <QtGui/QGuiApplication>
#include <QtCore/QDir>
#include <QtQuick/QQuickView>
#include <QtQml/QQmlEngine>
#include "window.h"
#include <QWidget>
#include "threeDviewer.h"
#include "datapointobject.h"
Flightviewer::Flightviewer(Flight displayedFlight, QString directory, QWidget*parent){
// The following are needed to make examples run without having to install the module
// in desktop environments.
#ifdef Q_OS_WIN
QString extraImportPath(QStringLiteral("%1/../../../../%2"));
#else
QString extraImportPath(QStringLiteral("%1/../../../%2"));
#endif
qmlRegisterType<DataObject>();
readFlightTrajectory(displayedFlight);
viewer.setVisible(false);//Open only after clicked.
viewer.engine()->addImportPath(extraImportPath.arg(QGuiApplication::applicationDirPath(),
QString::fromLatin1("qml")));
//! [4]
QObject::connect(viewer.engine(), &QQmlEngine::quit, &viewer, &QWindow::close);
//! [4]
viewer.setTitle(QStringLiteral("3D Flight Trajectory Visualization"));
//! [3]
viewer.setSource(QUrl("qrc:/qmlscatter/qml/qmlscatter/main.qml"));
//! [3]
viewer.setResizeMode(QQuickView::SizeRootObjectToView);
//! [2]
//! [2]
}
Flightviewer::~Flightviewer(){
}
void Flightviewer::showWindow(){
viewer.showMaximized();
}
void Flightviewer::readFlightTrajectory(Flight flight){
QList<QObject*> dataList;
for (int i=0; i<flight.cogPosX_.size();i++){
dataList.append(new DataObject(flight.cogPosX_.at(i),flight.cogPosY_.at(i),flight.cogPosZ_.at(i)));
}
QQmlContext * ctxt = viewer.rootContext();
ctxt->setContextProperty("dataModel", QVariant::fromValue(dataList));
viewer.update();
}

"QQuickViewer 查看器"在外部函数中初始化，使用以下命令：

void Form::run3D(){
threeDviewer= new Flightviewer(displayedFlights_[flightIndex],directory_);//initiate viewer
threeDviewer->showWindow();//Show viewer
}

qml 文件中的数据定义与"qmlscatter"示例中完全相同：

Data.qml：

import QtQuick 2.1
Item {
property alias model: dataModel
ListModel {
id: dataModel
//ListElement{ xPos: -1000.0; yPos: 500.0; zPos: -5.0 }
} 
}

数据由 main.qml 文件访问，该文件定义了 Scatter3D 项目：

主.qml

//! [0]
import QtQuick 2.1
import QtQuick.Layouts 1.0
import QtDataVisualization 1.0
import "."
//! [0]
//! [1]
Rectangle {
id: mainView
//! [1]
width: 500
height: 500
//! [4]
Data {
id: seriesData
}
//! [4]
//! [13]
Theme3D {
id: themeIsabelle
type: Theme3D.ThemeIsabelle
font.family: "Lucida Handwriting"
font.pointSize: 40
}
//! [13]
Theme3D {
id: themeArmyBlue
type: Theme3D.ThemeArmyBlue
}
//! [8]
//! [9]
Item {
id: dataView
anchors.bottom: parent.bottom
//! [9]
width: parent.width
height: parent.height - buttonLayout.height
//! [8]
//! [2]
Scatter3D {
id: scatterGraph
width: dataView.width
height: dataView.height
//! [2]
//! [3]
theme: themeIsabelle
shadowQuality: AbstractGraph3D.ShadowQualitySoftLow
//! [3]
//! [6]
axisX.segmentCount: 3
axisX.subSegmentCount: 2
axisX.labelFormat: "%.2f"
axisZ.segmentCount: 2
axisZ.subSegmentCount: 2
axisZ.labelFormat: "%.2f"
axisY.segmentCount: 2
axisY.subSegmentCount: 2
axisY.labelFormat: "%.2f"
//! [6]
//! [5]
Scatter3DSeries {
id: scatterSeries
//! [5]
//! [10]
itemLabelFormat: "Series 1: X:@xLabel Y:@yLabel Z:@zLabel"
//! [10]
//! [11]
ItemModelScatterDataProxy {
itemModel: seriesData.model
xPosRole: "xPos"
yPosRole: "yPos"
zPosRole: "zPos"
}
//! [11]
}
}
}
RowLayout {
id: buttonLayout
Layout.minimumHeight: cameraToggle.height
width: parent.width
anchors.left: parent.left
spacing: 0
//! [7]
NewButton {
id: shadowToggle
Layout.fillHeight: true
Layout.fillWidth: true
text: scatterGraph.shadowsSupported ? "Hide Shadows" : "Shadows not supported"
enabled: scatterGraph.shadowsSupported
onClicked: {
if (scatterGraph.shadowQuality === AbstractGraph3D.ShadowQualityNone) {
scatterGraph.shadowQuality = AbstractGraph3D.ShadowQualitySoftLow;
text = "Hide Shadows";
} else {
scatterGraph.shadowQuality = AbstractGraph3D.ShadowQualityNone;
text = "Show Shadows";
}
}
}
//! [7]
NewButton {
id: smoothToggle
Layout.fillHeight: true
Layout.fillWidth: true
text: "Use Smooth for Series One"
onClicked: {
if (scatterSeries.meshSmooth === false) {
text = "Use Flat for Series One";
scatterSeries.meshSmooth = true;
} else {
text = "Use Smooth for Series One"
scatterSeries.meshSmooth = false;
}
}
}
NewButton {
id: cameraToggle
Layout.fillHeight: true
Layout.fillWidth: true
text: "Change Camera Placement"
onClicked: {
if (scatterGraph.scene.activeCamera.cameraPreset === Camera3D.CameraPresetFront) {
scatterGraph.scene.activeCamera.cameraPreset =
Camera3D.CameraPresetIsometricRightHigh;
} else {
scatterGraph.scene.activeCamera.cameraPreset = Camera3D.CameraPresetFront;
}
}
}
NewButton {
id: themeToggle
Layout.fillHeight: true
Layout.fillWidth: true
text: "Change Theme"
onClicked: {
if (scatterGraph.theme.type === Theme3D.ThemeArmyBlue) {
scatterGraph.theme = themeIsabelle
} else {
scatterGraph.theme = themeArmyBlue
}
if (scatterGraph.theme.backgroundEnabled === true) {
backgroundToggle.text = "Hide Background";
} else {
backgroundToggle.text = "Show Background";
}
}
}
NewButton {
id: backgroundToggle
Layout.fillHeight: true
Layout.fillWidth: true
text: "Hide Background"
onClicked: {
if (scatterGraph.theme.backgroundEnabled === true) {
scatterGraph.theme.backgroundEnabled = false;
text = "Show Background";
} else {
scatterGraph.theme.backgroundEnabled = true;
text = "Hide Background";
}
}
}
NewButton {
id: exitButton
Layout.fillHeight: true
Layout.fillWidth: true
text: "Quit"
onClicked: Qt.quit(0);
}
}
}

如果您能给我一些有关如何正确编程的提示，我将不胜感激。事先谢谢！

Answer 1

以下是从C++向 Scatter3D 提供数据的简单示例：

首先，我们定义了一个从QAbstractListModel派生的模型类。在这种情况下，我们必须仅提供 3 种方法的实现。

飞行模型.h

#ifndef FLIGHTMODEL_H
#define FLIGHTMODEL_H
#include <QAbstractListModel>
#include <QList>
#include <QVector3D>
class FlightModel : public QAbstractListModel
{
Q_OBJECT
public:
FlightModel(QObject *parent = Q_NULLPTR);
int rowCount(const QModelIndex &parent = QModelIndex()) const override;
QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override;
QHash<int, QByteArray> roleNames() const override;
private:
QList<QVector3D> m_innerData;
};
#endif // FLIGHTMODEL_H

飞行模型.cpp

#include "flightmodel.h"
FlightModel::FlightModel(QObject *parent) : QAbstractListModel(parent)
{
qsrand(time(NULL));
int count = 100 + qrand() % 100;
for(int i = 0;i < count;i ++) {
double x = (double)(qrand() % 1000);
double y = (double)(qrand() % 1000);
double z = (double)(qrand() % 1000);
m_innerData.append(QVector3D(x, y, z));
}
}
int FlightModel::rowCount(const QModelIndex &parent) const
{
return m_innerData.count();
}
QVariant FlightModel::data(const QModelIndex &index, int role) const
{
if(!index.isValid())
return QVariant();
QVector3D point = m_innerData[index.row()];
switch(role) {
case Qt::UserRole + 1: return point.x(); break;
case Qt::UserRole + 2: return point.y(); break;
case Qt::UserRole + 3: return point.z(); break;
}
return QVariant();
}
QHash<int, QByteArray> FlightModel::roleNames() const
{
QHash<int, QByteArray> roles;
roles[Qt::UserRole + 1] = "x";
roles[Qt::UserRole + 2] = "y";
roles[Qt::UserRole + 3] = "z";
return roles;
}

构造函数创建 100-200 个随机 3D 点的数组作为我们的数据源。

要在 QML 中使用模型，我们应该使用qmlRegisterType或setContextProperty.在这种情况下，我使用第一个。

QQmlApplicationEngine engine;
qmlRegisterType<FlightModel>("mytest", 1, 0, "FlightModel");
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

所以现在我们可以在 QML 中使用该模型：

主.qml

import QtQuick 2.9
import QtQuick.Window 2.0
import QtDataVisualization 1.2
import mytest 1.0
Window {
id: window
width: 600
height: 400
visible: true
FlightModel {
id: dataModel
}
Scatter3D {
anchors.fill: parent
Scatter3DSeries {
ItemModelScatterDataProxy {
itemModel: dataModel
xPosRole: "x"
yPosRole: "y"
zPosRole: "z"
}
}
}
}