[Solved]-Highcharts: Auto-scale rendered shape along with chart?-Highcharts

You can store reference to an element and edit it's attributes, for example based on axis values. Example:

chart: {
    events: {
        render: function() {
            const chart = this;
            const xAxis = chart.xAxis[0];
            const yAxis = chart.yAxis[0];
            const startX = xAxis.toPixels(1);
            const startY = yAxis.toPixels(7);
            const width = xAxis.toPixels(6) - startX;
            const height = yAxis.toPixels(4) - startY;

            if (!chart.customRect) {
                chart.customRect = chart.renderer.rect().attr({
                    'stroke-width': 2,
                    stroke: 'red',
                    fill: 'yellow'
                }).add();
            }

            chart.customRect.attr({
                x: startX,
                y: startY,
                width,
                height
            });
        }
    }
}

Live demo: http://jsfiddle.net/BlackLabel/p6743jam/

API Reference:

https://api.highcharts.com/class-reference/Highcharts.SVGElement#attr

https://api.highcharts.com/class-reference/Highcharts.Axis#toPixels