From 45ab89462256b7421bfa458ab2871115e1b5c522 Mon Sep 17 00:00:00 2001
From: evlist <vdv@dyomedea.com>
Date: Thu, 3 Nov 2022 12:19:21 +0100
Subject: [PATCH] Marker bug fix

---
 src/components/map/Marker.tsx | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/map/Marker.tsx b/src/components/map/Marker.tsx
index bb1f5e3..6c5d9e4 100644
--- a/src/components/map/Marker.tsx
+++ b/src/components/map/Marker.tsx
@@ -11,18 +11,28 @@ export interface MarkerProperties {
 }
 
 export const Marker: react.FC<MarkerProperties> = (props: MarkerProperties) => {
-  if (props.keyObject === undefined || props.zoom === undefined) return null;
+  if (
+    props.keyObject === undefined ||
+    props.zoom === undefined ||
+    props.viewPort === undefined
+  ) {
+    console.log(`Marker props undefined: ${JSON.stringify(props)} `);
+    return null;
+  }
 
   const x = lon2tile(props.coordinates.lon, props.keyObject.zoomLevel);
   const y = lat2tile(props.coordinates.lat, props.keyObject.zoomLevel);
-  if (props.viewPort === undefined) return null;
   if (
     x < props.viewPort.topLeft.x ||
-    x > props.viewPort.bottomRight.x ||
+    x > props.viewPort.bottomRight.x + 1 ||
     y < props.viewPort.topLeft.y ||
-    y > props.viewPort.bottomRight.y
-  )
+    y > props.viewPort.bottomRight.y + 1
+  ) {
+    console.log(
+      `Marker ${x}, ${y} out of viewport: ${JSON.stringify(props.viewPort)} `
+    );
     return null;
+  }
   return (
     <g transform={`translate(${x}, ${y}) scale(${1 / props.zoom})`}>
       {props.icon}