QML / OSM。如何显示圈子?

时间:2018-01-08 14:00:11

标签: c++ qt qml openstreetmap

我有一张地图,我需要在她的圈子上显示。在从C ++ / Qt代码执行程序期间,此循环的位置也会发生变化。我怎样才能做到这一点?

map.qml

import QtQuick 2.9

import QtLocation 5.6
import QtPositioning 5.6

Rectangle {
    Plugin {
        id: osmMapPlugin
        name: "osm"
    }

    Map {
        anchors.fill: parent
        plugin: osmMapPlugin
        center: QtPositioning.coordinate(56.006355, 92.860984)
        zoomLevel: 10

        MapPolyline {
            id: pl
            line.width: 2
            line.color: 'red'
        }
    }

    function loadPath() {
        var lines = [];
        if (pl.pathLength() < pathController.geopath.size()) {
            lines = pl.path;
            for(var i = pl.pathLength(); i < pathController.geopath.size(); i++) {
                lines[i] = pathController.geopath.coordinateAt(i)
            }
        } else {
            for(var i = 0; i < pathController.geopath.size(); i++) {
                lines[i] = pathController.geopath.coordinateAt(i)
            }
        }

        return lines;
    }

    Connections {
        target: pathController
        onGeopathChanged: pl.path = loadPath()
    }

    Component.onCompleted: pl.path = loadPath()
}

我尝试为circle添加字段map,但未成功。求助。

1 个答案:

答案 0 :(得分:1)

要在地图中绘制圆圈,您需要使用MapCircle,如果您想从C ++操纵您的位置,那么创建一个控制您的位置和半径的类是合适的,我给您看一个例子下:

class CircleController: public QObject{
    Q_OBJECT
    Q_PROPERTY(QGeoCoordinate center READ center NOTIFY centerChanged)
    Q_PROPERTY(qreal radius READ radius WRITE setRadius NOTIFY radiusChanged)
public:
    CircleController(QObject *parent=0):QObject(parent){
        mCircle.setRadius(1000);
    }
    void setCenter(const QGeoCoordinate &center){
        if(mCircle.center() == center)
            return;
        mCircle.setCenter(center);
        emit centerChanged();
    }
    QGeoCoordinate center() const{ return mCircle.center();}

    void translate(double degreesLatitude, double degreesLongitude){
        mCircle.translate(degreesLatitude, degreesLongitude);
        emit centerChanged();
    }

    qreal radius() const{ return mCircle.radius();}
    void setRadius(const qreal &radius){
        if(mCircle.radius() == radius)
            return;
        mCircle.setRadius(radius);
        emit radiusChanged();
    }
signals:
    void centerChanged();
    void radiusChanged();
private:
    QGeoCircle mCircle;
};

然后通过setContextProperty()传递给QML:

CircleController circleController;
circleController.setCenter(QGeoCoordinate(56.006355, 92.860984)); // new position

QQmlApplicationEngine engine;
engine.rootContext()->setContextProperty("circleController", &circleController);

然后连接收音机和控制器的中心以及QML中的MapCircle

Window {
    visible: true
    width: 640
    height: 480

    Plugin {
        id: osmMapPlugin
        name: "osm"
    }
    Map {
        anchors.fill: parent
        plugin: osmMapPlugin
        center: QtPositioning.coordinate(56.006355, 92.860984)
        zoomLevel: 10

        MapCircle {
            center: circleController.center
            radius: circleController.radius
            color: 'green'
            border.width: 3
        }
    }
}

在下面的link中,您将找到一个示例