Reverse the path of PathInterpolator

Markkyboy

The code below produces a candy cane shaped path with an orange indicator at the right hand end of the line ( see first image), this means "Progress" reports as 0.0

I'd like the indicator to start the other end of the path at the bottom of the arc( see second image ), this means "Progress" reports as 1.0, but I would like Progress to be 0.0 at the start.

The indicator will eventually be animated to simulate a rev counter.

PathInterpolator {
    id: motionPath
    path: Path {
        id: progressPath
        startX: 1700
        startY: 360
        PathLine { x: 420; y: 360 }
        PathArc { x: 420; y: 760; radiusX: 1; radiusY: 1; direction: PathArc.Counterclockwise }
    }
}
Rectangle {
    id: needle
    width: 20
    height: 200
    color: "orange"
    x: motionPath.x
    y: motionPath.y
    rotation: motionPath.angle
    transformOrigin: Item.TopLeft
}
Canvas {
    id: candyCane
    anchors.fill: parent
    onPaint: {
        var ctx = getContext("2d");
        ctx.strokeStyle = "red"
        ctx.path = progressPath;
        ctx.lineWidth = 4;
        ctx.stroke();
    }
    onVisibleChanged: requestPaint()
}

Markkyboy

I solved this after a few attempts using ChatGPT, not what I wanted ultimately, but manually I really struggled with this.