diff --git a/src/google_map.js b/src/google_map.js
index 1a0bd80e..dc525a77 100644
--- a/src/google_map.js
+++ b/src/google_map.js
@@ -239,7 +239,7 @@ export default class GoogleMap extends Component {
this.zoomAnimationInProgress_ = false;
this.state = {
- overlayCreated: false,
+ overlay: null,
};
}
@@ -587,7 +587,7 @@ export default class GoogleMap extends Component {
: '2000px';
const div = document.createElement('div');
- this.div = div;
+ this.overlay = div;
div.style.backgroundColor = 'transparent';
div.style.position = 'absolute';
div.style.left = '0px';
@@ -601,29 +601,21 @@ export default class GoogleMap extends Component {
maps,
overlay.getProjection()
);
- ReactDOM.unstable_renderSubtreeIntoContainer(
- this_,
- ,
- div,
- // remove prerendered markers
- () => this_.setState({ overlayCreated: true })
- );
+
+ this_.setState(state => ({
+ ...state,
+ overlay: div,
+ }));
},
onRemove() {
- if (this.div) {
- ReactDOM.unmountComponentAtNode(this.div);
+ this_.setState(state => ({
+ ...state,
+ overlay: null,
+ }));
+
+ if (this.overlay) {
+ ReactDOM.unmountComponentAtNode(this.overlay);
}
},
@@ -1062,7 +1054,7 @@ export default class GoogleMap extends Component {
};
render() {
- const mapMarkerPrerender = !this.state.overlayCreated
+ const mapMarkerPrerender = !this.state.overlay
?
+ {this.state.overlay &&
+ ReactDOM.createPortal(
+ ,
+ this.state.overlay
+ )}
{/* render markers before map load done */}
{mapMarkerPrerender}