Overlay rectangle on ChartView

[BobbyG]

I want to put a number of rectangles as overlays to show regions of interest on a ChartView of ScatterSeries. However when I try to do this it is clearly using a different coordinate system to that of the ScatterSeries as it is drawn in a completely different place.

For example the following is intended to draw a rectangle that captures all of the ScatterSeries but it just draws a small green rectangle top left as shown in the screenshot.

        ChartView {
            Layout.fillWidth : true
            Layout.fillHeight : true
            Rectangle {
                x: 30
                y: 50
                width: 40
                height: 10
                color: "green"
            }
            ScatterSeries{
                XYPoint { x: 30; y: 50 }
                XYPoint { x: 50; y: 60 }
                XYPoint { x: 60; y: 50 }
                XYPoint { x: 70; y: 60 }
                axisX: ValueAxis {
                    min: 0
                    max: 100
                }
                axisY: ValueAxis {
                    min: 0
                    max: 100
                }
            }

The documentation suggests that the rectangle should use the coordinate system of the parent ChartView. I assume I actually want it to use the coordinate system of the ChartView scene. How do I do this?

[IntruderExcluder]

Cannot test charts right now, but you can set, for example z: 10 to your rectangle or declare it after ScatterSeries.

[BobbyG]

@intruderexcluder - That does not change the coordinate system to match that of the plot area so it is still too small and in the wrong place.