Почему не работает anchor?

Здравствуйте! Имеется некий QML-код:

// main.qml

import QtQuick 2.0
import QtQuick.Window 2.0

Window {
    visible: true;
    width: 800
    height: 600
    Temperature {
        id: temp
        value: 15
        min: 10
        max: 20
        anchors.centerIn: parent
    }
    Temperature {
        id: temp2
        value: 20
        min: 10
        max: 20
        anchors.left: temp.right
    }
}

//Temperature.qml
import QtQuick 2.0

Rectangle {
    property real value: 0
    property real min: 0
    property real max: 0
    readonly property bool belowMin: (min != max) ? (value < min) : false
    readonly property bool aboveMax: (min != max) ? (value > max) : false
    readonly property bool normal: (min != max) ? ((value >= min) && (value <= max)) : true

    Rectangle {
        id: display
        width: 40
        height: 20
        border.width: 1
        color: (normal) ? "lightgreen" : ((belowMin) ? "grey" : "red")
        Text {
            anchors.centerIn: parent
            text: value;
            font.pixelSize: parent.width * 0.3;
        }
    }
    Image {
        width: display.width * 0.5
        anchors.top: display.bottom
        anchors.horizontalCenter: display.horizontalCenter
        source: "qrc:/images/temperature.png"
        fillMode: Image.PreserveAspectFit
    }
}

Результат выполнения кода по какой-то причине не совпадает с кодом, потому что, судя по строчке anchors.left: temp.right, второй объект Temperature должен находиться слева от первого объекта.

Подскажите пожалуйста, в чем проблема? Никак не могу найти ответ.