From dd60e7263c13b287753afa058f03a4218ec37399 Mon Sep 17 00:00:00 2001
From: Adam Lee <adam123dublin@gmail.com>
Date: Thu, 11 Jul 2019 19:21:38 +0100
Subject: [PATCH] Update README.md

README now includes instructions to include custom map styling.
---
 README.md | 39 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/README.md b/README.md
index a8d25d8f..05304dd7 100644
--- a/README.md
+++ b/README.md
@@ -534,6 +534,45 @@ The `<Circle />` component listens to `onClick`, `onMouseover` and `onMouseout`
 
 The `GoogleApiWrapper` automatically passes the `google` instance loaded when the component mounts (and will only load it once).
 
+#### Custom Map Style
+
+To set your own custom map style, import your custom map style in JSON format.
+
+```javascript
+const mapStyle = [
+  {
+    featureType: 'landscape.man_made',
+    elementType: 'geometry.fill',
+    stylers: [
+      {
+        color: '#dceafa'
+      }
+    ]
+  },
+  ]
+
+ _mapLoaded(mapProps, map) {
+    map.setOptions({
+       styles: mapStyle
+    })
+ }
+
+render() {
+  return (
+    <Map
+      style={style}
+      google={this.props.google}
+      zoom={this.state.zoom}
+      initialCenter={this.state.center}
+      onReady={(mapProps, map) => this._mapLoaded(mapProps, map)}
+    >
+      ...
+    </Map>
+   );
+ }
+      
+```
+
 ## Manually loading the Google API
 
 If you prefer not to use the automatic loading option, you can also pass the `window.google` instance as a `prop` to your `<Map />` component.