Inside of the redraw event, you can check current zoom level, and if it exceeds certain threshold, you can dynamically add tiledwebmap series. Then, on zooming out, you can also check the zoom level and based on it's value hide or show the tiledwebmap series.
events: {
redraw() {
const chart = this;
const zoom = chart.mapView.zoom;
const zoomThreshold = 3;
if (chart.series.length <= 1) {
if (zoom >= zoomThreshold) {
chart.addSeries({
type: 'tiledwebmap',
provider: {
type: 'OpenStreetMap'
}
}, false);
}
} else
chart.series[1].setVisible(zoom >= zoomThreshold, false);
}
}
}
Demo: https://jsfiddle.net/BlackLabel/pczrf1ah/
API:
https://api.highcharts.com/class-reference/Highcharts.Chart#addSeries
https://api.highcharts.com/class-reference/Highcharts.Series#setVisible