From 18a5986b83965346860222800ad9d54f9d8a4f05 Mon Sep 17 00:00:00 2001
From: Ian <38500123+IBanda@users.noreply.github.com>
Date: Wed, 21 Jul 2021 01:04:38 +0800
Subject: [PATCH 1/5] add markerPosition prop

---
 src/google_map_markers.js | 64 ++++++++++++++++++++++++++++++++++-----
 1 file changed, 56 insertions(+), 8 deletions(-)

diff --git a/src/google_map_markers.js b/src/google_map_markers.js
index e2fbb666..8e1640c2 100644
--- a/src/google_map_markers.js
+++ b/src/google_map_markers.js
@@ -24,6 +24,25 @@ const style = {
   position: 'absolute',
 };
 
+const markerWrapperStyles = {
+  ...style,
+  height: null,
+  width: null,
+};
+
+const markerAxisX = {
+  left: 0,
+  center: '-50%',
+  right: '-100%',
+};
+
+const markerAxisY = {
+  top: 0,
+  center: '-50%',
+  bottom: '-100%',
+};
+const isNotProduction = process.env.NODE_ENV !== 'production';
+
 export default class GoogleMapMarkers extends Component {
   /* eslint-disable react/forbid-prop-types */
   static propTypes = {
@@ -320,20 +339,49 @@ export default class GoogleMapMarkers extends Component {
           ...latLng,
         };
 
+        const markerPosition = child.props.markerPosition || 'center center';
+
+        if (typeof markerPosition === 'string') {
+          [this.markerPosX, this.markerPosY] = markerPosition.trim().split(' ');
+
+          if (!markerAxisX[this.markerPosX] && isNotProduction)
+            console.error(
+              `Invalid x value passed for markerPosition, expected strings left,center or right`
+            );
+
+          if (!markerAxisY[this.markerPosY] && isNotProduction)
+            console.error(
+              `Invalid y value passed for markerPosition, expected strings top,center or bottom`
+            );
+        } else if (isNotProduction) {
+          console.error(
+            `Warning: Failed prop type: Invalid prop markerPosition of ${typeof markerPosition} supplied, expected string`
+          );
+        }
+
         return (
           <div
             key={childKey}
             style={{ ...style, ...stylePtPos }}
             className={child.props.$markerHolderClassName}
           >
-            {React.cloneElement(child, {
-              $hover: childKey === this.state.hoverKey,
-              $getDimensions: this._getDimensions,
-              $dimensionKey: childKey,
-              $geoService: this.props.geoService,
-              $onMouseAllow: this._onMouseAllow,
-              $prerender: this.props.prerender,
-            })}
+            <div
+              style={{
+                ...markerWrapperStyles,
+                transform: `translate(${markerAxisX[this.markerPosX]},${
+                  markerAxisY[this.markerPosY]
+                })`,
+              }}
+            >
+              {React.cloneElement(child, {
+                $hover: childKey === this.state.hoverKey,
+                $getDimensions: this._getDimensions,
+                $dimensionKey: childKey,
+                $geoService: this.props.geoService,
+                $onMouseAllow: this._onMouseAllow,
+                $prerender: this.props.prerender,
+              })}
+            </div>
           </div>
         );
       }

From 556bd782f22f9014f673e229408a28d992533a8c Mon Sep 17 00:00:00 2001
From: Ian <38500123+IBanda@users.noreply.github.com>
Date: Wed, 21 Jul 2021 01:20:47 +0800
Subject: [PATCH 2/5] use existing marker wrapper

---
 src/google_map_markers.js | 41 ++++++++++++++-------------------------
 1 file changed, 15 insertions(+), 26 deletions(-)

diff --git a/src/google_map_markers.js b/src/google_map_markers.js
index 8e1640c2..61379530 100644
--- a/src/google_map_markers.js
+++ b/src/google_map_markers.js
@@ -16,20 +16,12 @@ const mainStyle = {
 };
 
 const style = {
-  width: 0,
-  height: 0,
   left: 0,
   top: 0,
   backgroundColor: 'transparent',
   position: 'absolute',
 };
 
-const markerWrapperStyles = {
-  ...style,
-  height: null,
-  width: null,
-};
-
 const markerAxisX = {
   left: 0,
   center: '-50%',
@@ -362,26 +354,23 @@ export default class GoogleMapMarkers extends Component {
         return (
           <div
             key={childKey}
-            style={{ ...style, ...stylePtPos }}
+            style={{
+              ...style,
+              ...stylePtPos,
+              transform: `translate(${markerAxisX[this.markerPosX]},${
+                markerAxisY[this.markerPosY]
+              }`,
+            }}
             className={child.props.$markerHolderClassName}
           >
-            <div
-              style={{
-                ...markerWrapperStyles,
-                transform: `translate(${markerAxisX[this.markerPosX]},${
-                  markerAxisY[this.markerPosY]
-                })`,
-              }}
-            >
-              {React.cloneElement(child, {
-                $hover: childKey === this.state.hoverKey,
-                $getDimensions: this._getDimensions,
-                $dimensionKey: childKey,
-                $geoService: this.props.geoService,
-                $onMouseAllow: this._onMouseAllow,
-                $prerender: this.props.prerender,
-              })}
-            </div>
+            {React.cloneElement(child, {
+              $hover: childKey === this.state.hoverKey,
+              $getDimensions: this._getDimensions,
+              $dimensionKey: childKey,
+              $geoService: this.props.geoService,
+              $onMouseAllow: this._onMouseAllow,
+              $prerender: this.props.prerender,
+            })}
           </div>
         );
       }

From f8cac72a1935022e05f2166ac152a1b6f3de6e7d Mon Sep 17 00:00:00 2001
From: Ian <38500123+IBanda@users.noreply.github.com>
Date: Thu, 22 Jul 2021 04:48:06 +0800
Subject: [PATCH 3/5] print error in none production env

---
 src/google_map_markers.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/google_map_markers.js b/src/google_map_markers.js
index 61379530..24dea5f5 100644
--- a/src/google_map_markers.js
+++ b/src/google_map_markers.js
@@ -33,7 +33,7 @@ const markerAxisY = {
   center: '-50%',
   bottom: '-100%',
 };
-const isNotProduction = process.env.NODE_ENV !== 'production';
+const isProduction = process.env.NODE_ENV === 'production';
 
 export default class GoogleMapMarkers extends Component {
   /* eslint-disable react/forbid-prop-types */
@@ -336,16 +336,16 @@ export default class GoogleMapMarkers extends Component {
         if (typeof markerPosition === 'string') {
           [this.markerPosX, this.markerPosY] = markerPosition.trim().split(' ');
 
-          if (!markerAxisX[this.markerPosX] && isNotProduction)
+          if (!markerAxisX[this.markerPosX] && !isProduction)
             console.error(
               `Invalid x value passed for markerPosition, expected strings left,center or right`
             );
 
-          if (!markerAxisY[this.markerPosY] && isNotProduction)
+          if (!markerAxisY[this.markerPosY] && !isProduction)
             console.error(
               `Invalid y value passed for markerPosition, expected strings top,center or bottom`
             );
-        } else if (isNotProduction) {
+        } else if (!isProduction) {
           console.error(
             `Warning: Failed prop type: Invalid prop markerPosition of ${typeof markerPosition} supplied, expected string`
           );

From eefa0e40a8906ea8fe27e0ca72f725617566357e Mon Sep 17 00:00:00 2001
From: Ian <38500123+IBanda@users.noreply.github.com>
Date: Thu, 22 Jul 2021 13:53:47 +0800
Subject: [PATCH 4/5] use `center bottom` as default marker position

---
 src/google_map_markers.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/google_map_markers.js b/src/google_map_markers.js
index 24dea5f5..97ea6369 100644
--- a/src/google_map_markers.js
+++ b/src/google_map_markers.js
@@ -331,7 +331,7 @@ export default class GoogleMapMarkers extends Component {
           ...latLng,
         };
 
-        const markerPosition = child.props.markerPosition || 'center center';
+        const markerPosition = child.props.markerPosition || 'center bottom';
 
         if (typeof markerPosition === 'string') {
           [this.markerPosX, this.markerPosY] = markerPosition.trim().split(' ');

From 93e795043732399cfd1ab57642ce60fb2ce57525 Mon Sep 17 00:00:00 2001
From: Ian <38500123+IBanda@users.noreply.github.com>
Date: Thu, 22 Jul 2021 13:55:02 +0800
Subject: [PATCH 5/5] add missing closing bracket

---
 src/google_map_markers.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/google_map_markers.js b/src/google_map_markers.js
index 97ea6369..254f7fe4 100644
--- a/src/google_map_markers.js
+++ b/src/google_map_markers.js
@@ -359,7 +359,7 @@ export default class GoogleMapMarkers extends Component {
               ...stylePtPos,
               transform: `translate(${markerAxisX[this.markerPosX]},${
                 markerAxisY[this.markerPosY]
-              }`,
+              })`,
             }}
             className={child.props.$markerHolderClassName}
           >