Carte minimale (QML)

Le code minimum pour afficher une carte à l'aide de Qt Quick.

Minimal Map montre comment utiliser l'élément Map pour afficher une carte. Il montre le minimum de code nécessaire pour afficher la carte et peut être utilisé comme base pour d'autres expériences.

Exécution de l'exemple

Pour exécuter l'exemple à partir de Qt CreatorOuvrez le mode Welcome et sélectionnez l'exemple à partir de Examples. Pour plus d'informations, voir Qt Creator: Tutoriel : Construire et exécuter.

Code C++

Dans main.cpp, nous n'utilisons que les classes QGuiApplication et QQmlApplicationEngine.

#include <QGuiApplication>
#include <QQmlApplicationEngine>

Dans la fonction principale, nous commençons par instancier un objet QGuiApplication. Ensuite, nous créons un objet QQmlApplicationEngine et lui demandons de charger main.qml à partir du système de ressources Qt.

Enfin, QGuiApplication::exec() lance la boucle événementielle principale.

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

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

    return app.exec();
}

Code QML

Dans main.qml, nous importons le module QML QtLocation et le module QML QtPositioning qui en dépend. Ensuite, nous créons la fenêtre de premier niveau, définissons une taille par défaut raisonnable et la rendons visible. La fenêtre sera remplie par un élément Map montrant la carte.

import QtQuick
import QtLocation
import QtPositioning

Window {
    width: Qt.platform.os == "android" ? Screen.width : 512
    height: Qt.platform.os == "android" ? Screen.height : 512
    visible: true
    title: map.center + " zoom " + map.zoomLevel.toFixed(3)
           + " min " + map.minimumZoomLevel + " max " + map.maximumZoomLevel

    Plugin {
        id: mapPlugin
        name: "osm"
    }

    Map {
        id: map
        anchors.fill: parent
        plugin: mapPlugin
        center: QtPositioning.coordinate(59.91, 10.75) // 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)
        }
    }
}

L'élément Plugin est nécessaire pour définir le fournisseur de cartes que nous allons utiliser. L'exemple peut fonctionner avec n'importe lequel des plugins de services géographiques disponibles. Cependant, certains plugins peuvent nécessiter des paramètres supplémentaires pour fonctionner correctement et nous pouvons utiliser PluginParameter pour les spécifier. Dans cet exemple, nous utilisons le plugin osm, qui est un pluginQt Location Open Street Map et qui ne nécessite aucun paramètre.

Dans l'élément Map, nous faisons référence au plugin que nous utilisons et nous définissons les center et zoomLevel de la carte.

Exigences

L'exemple nécessite une connexion Internet opérationnelle pour télécharger les tuiles de la carte OpenStreetMap. Un proxy système optionnel devrait être pris en charge automatiquement.

Exemple de projet @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.