向 Qt QML 地图添加标记/位置?

Ahm*_* M. 4 c++ qt qml qt5

再会 !我正在设计一个基于 Qt 的 GUI 平台,该平台显示地图并允许用户在地图顶部添加标记/图钉

我正在使用以下 QML 在 QtQuickWidget 中渲染地图:

Plugin {
    id: mapPlugin
    name: "osm"
}
Run Code Online (Sandbox Code Playgroud)

我想允许用户使用表单上的按钮在地图上添加交互式图钉。用户可以按住地图上的一个点,这将打开表单,用户可以在其中命名该地点并按OK

交互式引脚示例

我想要实现的示例: https : //webmshare.com/play/5EXV8


  1. 我曾尝试使用 QQmlComponent 和 QQuickView 但我没有成功 [ http://doc.qt.io/qt-5/qtqml-cppintegration-interactqmlfromcpp.html]

  2. 另一种方法是使用MapItems在 QML 本身中添加对象,但这非常不直观。这是我的 map.qml 的样子:https ://gist.github.com/blackvitriol/7941688d6362162888630a28c79f8cd9

项目结构:https : //imgur.com/a/P8YAS

有人可以告诉我如何让用户按住左键单击地图,然后在该点添加标记吗?

eyl*_*esc 7

一个可能的解决方案是使用MapItemView并创建一个存储坐标的模型:

标记模型.h

#ifndef MARKERMODEL_H
#define MARKERMODEL_H

#include <QAbstractListModel>
#include <QGeoCoordinate>

class MarkerModel : public QAbstractListModel
{
    Q_OBJECT

public:
    using QAbstractListModel::QAbstractListModel;
    enum MarkerRoles{positionRole = Qt::UserRole + 1};

    Q_INVOKABLE void addMarker(const QGeoCoordinate &coordinate){
        beginInsertRows(QModelIndex(), rowCount(), rowCount());
        m_coordinates.append(coordinate);
        endInsertRows();
    }

    int rowCount(const QModelIndex &parent = QModelIndex()) const override{
        Q_UNUSED(parent)
        return m_coordinates.count();
    }

    QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override{
        if (index.row() < 0 || index.row() >= m_coordinates.count())
            return QVariant();
        if(role== MarkerModel::positionRole)
            return QVariant::fromValue(m_coordinates[index.row()]);
        return QVariant();
    }

    QHash<int, QByteArray> roleNames() const{
        QHash<int, QByteArray> roles;
        roles[positionRole] = "position";
        return roles;
    }

private:
    QList<QGeoCoordinate> m_coordinates;
};

#endif // MARKERMODEL_H
Run Code Online (Sandbox Code Playgroud)

主文件

import QtQuick 2.0
import QtLocation 5.6
import QtPositioning 5.6
import QtQuick.Window 2.0

Rectangle {
    width: Screen.width
    height: Screen.height
    visible: true

    Plugin {
        id: mapPlugin
        name: "osm"
    }

    Map {
        id: mapview
        anchors.fill: parent
        plugin: mapPlugin
        center: QtPositioning.coordinate(59.91, 10.75)
        zoomLevel: 14

        MapItemView{
            model: markerModel
            delegate: mapcomponent
        }
    }

    Component {
        id: mapcomponent
        MapQuickItem {
            id: marker
            anchorPoint.x: image.width/4
            anchorPoint.y: image.height
            coordinate: position

            sourceItem: Image {
                id: image
                source: "http://maps.gstatic.com/mapfiles/ridefinder-images/mm_20_red.png"
            }
        }
    }

    MouseArea {
        anchors.fill: parent

        onPressAndHold:  {
            var coordinate = mapview.toCoordinate(Qt.point(mouse.x,mouse.y))
            markerModel.addMarker(coordinate)
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

主程序

#include "markermodel.h"

#include <QApplication>
#include <QQuickWidget>
#include <QQmlContext>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    QQuickWidget w;
    MarkerModel model;
    w.rootContext()->setContextProperty("markerModel", &model);
    w.setSource(QUrl(QStringLiteral("qrc:/main.qml")));
    w.show();

    return a.exec();
}
Run Code Online (Sandbox Code Playgroud)

在此处输入图片说明

完整的示例可以在以下链接中找到。