qtgeolocationqmlqtlocationqt5.12

QML map zoom only verticaly

Does map in Qt have a property, so it doesn't move center if I move mouse cursor on random place on map and try to change zoom level with mouse wheel? Because on default, map zooms, but moves existing center towards mouse cursor location (example on picture below; if cursor is on shown position and we try to change zoom, geotag picture will move in arrow direction). I just need it to zoom straight up from designated center of map, regardless of mouse cursor location.

Map description: https://doc-snapshots.qt.io/qt5-5.9/qml-qtlocation-map.html

QML code

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

Item{
    id: itemControl
    objectName: "itemControl"
    width: 512
    height: 512
    visible: true

Plugin {
    id: mapPlugin
    PluginParameter { name: "osm.useragent"; value: "usermap" }
    name: "esri"
}

Map {
    id:map
    gesture.enabled: true
    gesture.acceptedGestures: MapGestureArea.PinchGesture | MapGestureArea.PanGesture
    objectName: "map"
    anchors.fill: parent
    bearing: 0
    width: 512
    height: 512
    plugin: mapPlugin
    center {
        latitude: 45.525180446
        longitude: 13.5575992170
    }
    zoomLevel: 15

    //If user doubleclicks on map update coordinates of pixel to coordinates on UI
    signal qmlSignalUpdateLat(string msg)
    signal qmlSignalUpdateLon(string msg)

    MouseArea
    {
        id: mousearea
        hoverEnabled: true
        anchors.fill: parent
        acceptedButtons: Qt.LeftButton
        onDoubleClicked: {
            map.center.latitude = map.toCoordinate(Qt.point(mouseX,mouseY)).latitude
            map.center.longitude = map.toCoordinate(Qt.point(mouseX,mouseY)).longitude
            map.qmlSignalUpdateLat(map.center.latitude)
            map.qmlSignalUpdateLon(map.center.longitude)
        }
    }

    function updateMap(lat,lon,bear){
        map.center.latitude = lat;
        map.center.longtitude = lon;
        map.bearing = bear;
    }

}
}

Example of cursor on screen and center movement

Solution

  • Probably there should be more elegant solutions, but here is your code simplified:

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

Window {
    width: 512
    height: 512
    visible: true
    Plugin {
        id: mapPlugin
        PluginParameter { name: "osm.useragent"; value: "usermap" }
        name: "esri"
    }
    Location {
        // Define location that will be "center" of map
        id: mapCenter
        coordinate {
            latitude: 45.525180446
            longitude: 13.5575992170
        }
    }
    Map {
        id: map
        anchors.fill: parent
        plugin: mapPlugin
        center: mapCenter.coordinate

        onCenterChanged: {
            // As soon as map center changed -- we'll check if coordinates differs from our
            //   mapCenter coordinates and if so, set map center coordinates equal to mapCenter
            if (map.center != mapCenter.coordinate) {
                map.center = mapCenter.coordinate
            }
        }

        MapCircle {
            // Circle just for ability to check if it zooms correctly
            center: mapCenter.coordinate
            radius: 500.0
            color: "green"
            border.width: 3
        }
    }
}

    Main idea behind this is to take control over each change of map's center. In case if it changes -- check weather it equal to our center. If it is not equal to our desired center mapCenter -- we change it.

    As a result:

    Static map center example