From 9450f29449844b0514d28f03bc49d965b707d980 Mon Sep 17 00:00:00 2001
From: Tom Russell <tomalrussell@gmail.com>
Date: Wed, 5 Dec 2018 20:39:16 +0000
Subject: [PATCH] =?UTF-8?q?Restrict=20rendered=20tiles=20to=20zoom=20?=
 =?UTF-8?q?=E2=89=A514?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/src/frontend/map.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/app/src/frontend/map.js b/app/src/frontend/map.js
index 083cd4e4..0feaa40e 100644
--- a/app/src/frontend/map.js
+++ b/app/src/frontend/map.js
@@ -81,14 +81,20 @@ class ColouringMap extends Component {
         // pick revision id to bust browser cache
         const rev = this.props.building? this.props.building.revision_id : '';
         const dataLayer = data_tileset?
-            <TileLayer key={data_tileset} url={`/tiles/${data_tileset}/{z}/{x}/{y}.png?rev=${rev}`} />
+            <TileLayer
+                key={data_tileset}
+                url={`/tiles/${data_tileset}/{z}/{x}/{y}.png?rev=${rev}`}
+                minZoom={14} />
             : null;
 
         // highlight
         const geometry_id = (this.props.building) ? this.props.building.geometry_id : undefined;
         const highlight = `/tiles/highlight/{z}/{x}/{y}.png?highlight=${geometry_id}`
         const highlightLayer = (is_building && this.props.building) ?
-            <TileLayer key={this.props.building.building_id} url={highlight} />
+            <TileLayer
+                key={this.props.building.building_id}
+                url={highlight}
+                minZoom={14} />
             : null;
 
         const base_layer_url = (this.state.theme === 'light')?
@@ -108,7 +114,7 @@ class ColouringMap extends Component {
                     onClick={this.handleClick}
                     >
                     <TileLayer url={url} attribution={attribution} />
-                    <TileLayer url={base_layer_url} />
+                    <TileLayer url={base_layer_url} minZoom={14} />
                     { dataLayer }
                     { highlightLayer }
                     <ZoomControl position="topright" />