Merge pull request #170 from Dahlgren/bugfix/map-tiles-offset

Fix map tiles offset
Anrop · Feb 11, 2022 · 188e549 · 188e549
2 parents a702016 + 785d103
commit 188e549
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 6 deletions.
diff --git a/src/components/ArmaMap.jsx b/src/components/ArmaMap.jsx
@@ -12,10 +12,11 @@ const scaledZoom = 2
 export default class ArmaMap extends Component {
   componentDidMount () {
     const { world } = this.props
-    var map = this.refs.map.leafletElement
-    var southWest = map.unproject([0, 0], world.size.zoom)
-    var northEast = map.unproject([world.size.width, world.size.height], world.size.zoom)
-    map.setMaxBounds(new LatLngBounds(southWest, northEast))
+    const map = this.refs.map.leafletElement
+    const offset = Math.pow(2, Math.ceil(Math.log2(world.size.height))) - world.size.height
+    const point1 = map.unproject([0, offset], world.size.zoom)
+    const point2 = map.unproject([world.size.width, world.size.height + offset], world.size.zoom)
+    map.setMaxBounds(new LatLngBounds(point1, point2))
   }
 
   getChildContext () {

diff --git a/src/components/ArmaMarkers.jsx b/src/components/ArmaMarkers.jsx
@@ -7,12 +7,13 @@ export class ArmaMarker extends React.Component {
   render () {
     const { className, markerSize, name, rotation, x, y } = this.props
     const { map, world } = this.context
+    const offset = Math.pow(2, Math.ceil(Math.log2(world.size.height))) - world.size.height
 
     return (
       <RotationMarker
         className={className}
         markerSize={markerSize}
-        position={map.unproject([x, y], world.size.zoom)}
+        position={map.unproject([x, y + offset], world.size.zoom)}
         rotation={rotation}
         title={name}
       >

diff --git a/src/components/ArmaProjectiles.jsx b/src/components/ArmaProjectiles.jsx
@@ -6,9 +6,10 @@ export class ArmaProjectile extends React.Component {
   render () {
     const { positions, color, weight } = this.props
     const { map, world } = this.context
+    const offset = Math.pow(2, Math.ceil(Math.log2(world.size.height))) - world.size.height
 
     const projectedPositions = positions.slice(-2).map(function (position) {
-      return map.unproject([position.x, position.y], world.size.zoom)
+      return map.unproject([position.x, position.y + offset], world.size.zoom)
     })
 
     return (