QtLocation: how to make drag-and-drop on Map?

Question

I have a QML Map widget. I want to drop some objects on it to get the latitude and longitude of the dropping point. How can I do it?

Answer 1

You can do that exactly as all other drag-n-drop applications. There are tons of examples as in Qt documentation as over the Internet. One of them:

import QtQuick 2.9
import QtQuick.Window 2.0
import QtLocation 5.3

Window {
    id: window
    width: 600
    height: 400
    visible: true

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        drag.target: item
        propagateComposedEvents: true
        onReleased: item.Drag.drop()
    }

    Plugin {
        id: mapPlugin
        preferred: ["osm", "esri"]
    }

    Map {
        id: map
        anchors.fill: parent
        anchors.topMargin: 40
        anchors.bottomMargin: 30
        plugin: mapPlugin
        center {
            latitude: 40.785091
            longitude: -73.968285
        }
        zoomLevel: 14
        DropArea {
            anchors.fill: parent
            onDropped: {
                var coord = map.toCoordinate(Qt.point(drop.x, drop.y));
                output.text = "latitude:" + coord.latitude + ", longitude:" + coord.longitude;
                anim.running = true;
            }
        }
    }

    Rectangle {
        id: item
        x: parent.width/2 - 20
        y: 0
        width: 40
        height: 40
        radius: 20
        color: "orange"
        opacity: 1
        Drag.active: mouseArea.drag.active
        Drag.hotSpot.x: 20
        Drag.hotSpot.y: 20

        Text {
            anchors.centerIn: parent
            text: "Drop me"
            font.pixelSize: 8
        }

        SequentialAnimation {
            id: anim
            running: false
            NumberAnimation { target: item; property: "opacity"; to: 0; duration: 500 }
            PropertyAction { target: item; property: "x"; value: window.width/2 - 20 }
            PropertyAction { target: item; property: "y"; value: 0 }
            NumberAnimation { target: item; property: "opacity"; to: 1; duration: 500 }
        }
    }

    Text {
        id: output
        anchors.bottom: parent.bottom
        height: 30
        width: window.width
        text:  ""
        verticalAlignment: Text.AlignVCenter
        horizontalAlignment: Text.AlignHCenter
    }
}