🔍 limiting tile repetion to x axis, optimizing moveBy

README.md

@@ -91,6 +91,7 @@ No web browser around? Don't worry - and discover the planet in your console!
 * Styler
   * [x] compile filters to function chains
   * [x] support constants
+  * [x] respect minzoom
 
 * Renderer
   * [x] position tiles accordingly

src/Renderer.coffee

@@ -25,7 +25,7 @@ module.exports = class Renderer
 
     tileSize: 4096
     projectSize: 256
-    maxZoom: 4
+    maxZoom: 14
 
     #"poi_label", "water",
     drawOrder: [
@@ -38,7 +38,10 @@ module.exports = class Renderer
 
       "country_label"
       "state_label"
+
+      "water_label"
       "place_label"
+      "rail_station_label"
       "poi_label"
       "housenum_label"
     ]
@@ -128,18 +131,22 @@ module.exports = class Renderer
       for x in [Math.floor(xyz[0])-1..Math.floor(xyz[0])+1]
         tile = x: x, y: y, z: z
 
-        position = [
+        position =
-          @width/2-(xyz[0]-tile.x)*tileSize
+          x: @width/2-(xyz[0]-tile.x)*tileSize
-          @height/2-(xyz[1]-tile.y)*tileSize
+          y: @height/2-(xyz[1]-tile.y)*tileSize
-        ]
 
-        tile.x %= Math.pow 2, z
+        gridSize = Math.pow 2, z
-        tile.y %= Math.pow 2, z
 
-        if position[0]+tileSize < 0 or
+        tile.x %= gridSize
-        position[1]+tileSize < 0 or
+        if tile.x < 0
-        position[0]>@width or
+          tile.x = if z is 0 then 0 else tile.x+gridSize
-        position[1]>@height
+
+        if tile.y < 0 or
+        tile.y >= gridSize or
+        position.x+tileSize < 0 or
+        position.y+tileSize < 0 or
+        position.x>@width or
+        position.y>@height
           continue
 
         tiles.push xyz: tile, zoom: zoom, position: position, scale: scale
@@ -159,10 +166,10 @@ module.exports = class Renderer
     scale = tile.scale
 
     box =
-      minX: -position[0]*scale
+      minX: -position.x*scale
-      minY: -position[1]*scale
+      minY: -position.y*scale
-      maxX: (@width-position[0])*scale
+      maxX: (@width-position.x)*scale
-      maxY: (@height-position[1])*scale
+      maxY: (@height-position.y)*scale
 
     features = {}
     for layer in @config.drawOrder
@@ -191,7 +198,7 @@ module.exports = class Renderer
         continue unless tile.features[layer]?.length
 
         @canvas.save()
-        @canvas.translate tile.position[0], tile.position[1]
+        @canvas.translate tile.position.x, tile.position.y
 
         for feature in tile.features[layer]
           continue if feature.data.id and drawn[feature.data.id]
@@ -234,7 +241,6 @@ module.exports = class Renderer
     #return false if feature.properties.class is "ferry"
     feature.type = "LineString" if layer is "building" or layer is "road"
 
-    # TODO: zoom level
     unless style = @styler.getStyleFor layer, feature, zoom
       return false
 

src/Termap.coffee

@@ -154,10 +154,10 @@ module.exports = class Termap
       when "k" then @rotation += 15
       when "l" then @rotation -= 15
 
-      when "left" then @center.lon -= 8/Math.pow(2, @zoom)
+      when "left" then @moveBy 0, -8/Math.pow(2, @zoom)
-      when "right" then @center.lon += 8/Math.pow(2, @zoom)
+      when "right" then @moveBy 0, 8/Math.pow(2, @zoom)
-      when "up" then @center.lat += 6/Math.pow(2, @zoom)
+      when "up" then @moveBy 6/Math.pow(2, @zoom), 0
-      when "down" then @center.lat -= 6/Math.pow(2, @zoom)
+      when "down" then @moveBy -6/Math.pow(2, @zoom), 0
 
       else
         null
@@ -200,3 +200,11 @@ module.exports = class Termap
     return @zoom = @maxZoom if @zoom+step > @maxZoom
 
     @zoom += step
+
+  moveBy: (lat, lon) ->
+    @center.lat += lat
+    @center.lon += lon
+
+    @center.lon = (@center.lon+180)%360-180
+    @center.lat = 85.0511 if @center.lat > 85.0511
+    @center.lat = -85.0511 if @center.lat < -85.0511

styles/bright.json

@@ -2324,19 +2324,6 @@
           ]
         }
       }
-    },
-    {
-      "type": "line",
-      "id": "ferry_road",
-      "paint": {
-        "line-color": "#303090"
-      },
-      "source-layer": "road",
-      "filter": [
-        "==",
-        "class",
-        "ferry"
-      ]
     }
   ]
 }