Qt使用qml（QtLocation）显示地图

一、qt版本和QtLocation模块版本确认

如果qt版本过低的话是没有QtLocation模块的，我的版本如下

构建工具版本如下

二、qml代码编写

1、工程中添加模块

首先在工程中添加模块quickwidgets positioning location

2、添加资源文件

3、在资源文件中添加qml文件

4、qml代码编写

import QtQuick
import QtLocation
import QtPositioning
import QtQuick.Controls
Rectangle {
    
    
    width: parent
    height: parent
    visible: true
    Control{
    
    
        id:labelcpp
        objectName: 'labelcpp'
        font.pointSize: 38
        property real latitudeSave: 22.64018
        property real longitudeSave: 113.92746
        //cpp调用这个函数
        function getText()
        {
    
    
            return  map.center + " zoom " + map.zoomLevel.toFixed(3)
                    + " min " + map.minimumZoomLevel + " max " + map.maximumZoomLevel
        }
        function setCoordinate(latitude,longitude)
        {
    
    
            latitudeSave = latitude
            longitudeSave = longitude
            map.center.latitude = latitude
            map.center.longitude = longitude
            map.update()
            console.log("latitude="+latitude+"   longitude="+longitude);
        }
    }


    Plugin {
    
    
        id: mapPlugin
        name: "osm"
//        PluginParameter { name: "osm.mapping.providersrepository.address"; value: "http://www.mywebsite.com/osm_repository" }
//        PluginParameter { name: "osm.mapping.highdpi_tiles"; value: true }
    }

    Map {
    
    
        id: map
        anchors.fill: parent
        plugin: mapPlugin
        center: QtPositioning.coordinate(22.64018, 113.92746) // Oslo
        zoomLevel: 14
        property geoCoordinate startCentroid

        PinchHandler {
    
    
            id: pinch
            target: null
            onActiveChanged: if (active) {
    
    
                map.startCentroid = map.toCoordinate(pinch.centroid.position, false)
            }
            onScaleChanged: (delta) => {
    
    
                map.zoomLevel += Math.log2(delta)
                map.alignCoordinateToPoint(map.startCentroid, pinch.centroid.position)
            }
            onRotationChanged: (delta) => {
    
    
                map.bearing -= delta
                map.alignCoordinateToPoint(map.startCentroid, pinch.centroid.position)
            }
            grabPermissions: PointerHandler.TakeOverForbidden
        }
        WheelHandler {
    
    
            id: wheel
            // workaround for QTBUG-87646 / QTBUG-112394 / QTBUG-112432:
            // Magic Mouse pretends to be a trackpad but doesn't work with PinchHandler
            // and we don't yet distinguish mice and trackpads on Wayland either
            acceptedDevices: Qt.platform.pluginName === "cocoa" || Qt.platform.pluginName === "wayland"
                             ? PointerDevice.Mouse | PointerDevice.TouchPad
                             : PointerDevice.Mouse
            rotationScale: 1/120
            property: "zoomLevel"
        }
        DragHandler {
    
    
            id: drag
            target: null
            onTranslationChanged: (delta) => map.pan(-delta.x, -delta.y)

        }
        Shortcut {
    
    
            enabled: map.zoomLevel < map.maximumZoomLevel
            sequence: StandardKey.ZoomIn
            onActivated: map.zoomLevel = Math.round(map.zoomLevel + 1)
        }
        Shortcut {
    
    
            enabled: map.zoomLevel > map.minimumZoomLevel
            sequence: StandardKey.ZoomOut
            onActivated: map.zoomLevel = Math.round(map.zoomLevel - 1)
        }
        Component.onCompleted: {
    
    
            map.addMapItem(circle)
        }
    }
    MapCircle {
    
    
        id: circle
        center: QtPositioning.coordinate(labelcpp.latitudeSave,labelcpp.longitudeSave)
        radius: 50
        border.width: 5

        //鼠标按住后可移动
        MouseArea {
    
    
            anchors.fill: parent
            drag.target: parent
        }
    }
}

Control是用来和c++进行数据交互的，通过setCoordinate发送坐标，在地图上定点，getText是用来获取地图的中点和地图缩放等级的。

5、和c++进行交互发送坐标点

void MainWindow::on_pushButton_clicked()
{
    
    
    QQuickItem *root = ui->quickWidget->rootObject();//拿到所有对象的列表
    auto labelqml = root->findChild<QObject*>("labelcpp");//名字要与main.qml中的 objectName: 'labelcpp' 相同
    QVariant ret;
    QMetaObject::invokeMethod(labelqml, "setCoordinate", Q_ARG(QVariant, 22.65599), Q_ARG(QVariant, 113.92576));
    qDebug() << ret.toString();
}

三、效果展示