Поворот изображения в MapQuickItem вокруг его центра

Question

Я использую MapQuickItem с Image как sourceItem для отображения местоположения пользователя на QML Map.

Документация для MapQuickItem гласит, что:

Установленная координата будет совпадать с верхним левым углом содержащегося элемента при отображении на экране..

Свойство anchorPoint позволяет выровнять координаты с другими частями элемента, а не только с верхним левым углом, установив число пикселей, в котором будет отображаться элемент.смещение на.

Простой способ думать об этом - заметить, что точка, заданная anchorPoint на самом предмете, является точкой, которая будет совпадать с данной coordinate при отображении.

Поэтому я установил опорную точку так, чтобы она соответствовала центру изображения следующим образом:

anchorPoint.x: img.width/2
anchorPoint.y: img.height/2

Это помещает центрстрелка прямо над местоположением пользователя.Пока все хорошо.

Теперь я хочу повернуть изображение вокруг его центра, чтобы показать заголовок пользователя, используя свойство rotation.

Документация дляСвойство Item transformOrigin гласит, что:

Доступно девять источников преобразования, как показано на рисунке ниже.По умолчанию источник преобразования Item.Center.

Таким образом, я ожидаю, что изображение будет вращаться вокруг своего центра, так как это поведение по умолчанию.

Но, к сожалению, реальность совсем иная.Вращение применяется вокруг верхнего левого угла изображения, перемещая стрелку от местоположения пользователя, как показано на следующем изображении:

• Была ли моя интерпретация документации неверной?
• Как заставить изображение вращаться вокруг его центра?

---

main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>

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

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

    return app.exec();
}

main.qml

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

Window {
    width: 512
    height: 512
    visible: true

    property variant loc: QtPositioning.coordinate(48.858222, 2.2945)

    Map {
        id: map
        anchors.fill: parent
        plugin: Plugin { name: "osm" }
        center: loc
        zoomLevel: 16

        MapQuickItem {
            id: arrow
            coordinate: loc

            anchorPoint.x: img.width/2
            anchorPoint.y: img.height/2

            sourceItem: Image {
                id: img
                NumberAnimation on rotation { from: 0; to: 360; duration: 2000; loops: Animation.Infinite; }
                source: "arrow.png"
            }
        }
    }
}

arrow.png : https://pasteboard.co/HYgV7Nf.png

Answer 1

Документация верна, проблема в том, как применяются задачи, что вы делаете, это сначала поворачиваете изображение, а затем вы просто устанавливаете источник MapQuickItem, который использует topleft в качестве точки отсчета, поэтому он всегда будет вращаться относительно topLeft.

Решение состоит в том, чтобы вращать MapQuickItem вместо sourceItem:

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

Window {
    width: 512
    height: 512
    visible: true

    property variant loc: QtPositioning.coordinate(48.858222, 2.2945)

    Map {
        id: map
        anchors.fill: parent
        plugin: Plugin { name: "osm" }
        center: loc
        zoomLevel: 16

        MapQuickItem {
            id: arrow
            coordinate: loc
            NumberAnimation on rotation { from: 0; to: 360; duration: 2000; loops: Animation.Infinite; }
            anchorPoint.x: img.width/2
            anchorPoint.y: img.height/2
            sourceItem: Image {
                id: img
                source: "arrow.png"
            }
        }
    }
}