diff --git a/README.md b/README.md index c42abf5..f0259d6 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,7 @@ A node.js based [Vector Tile](http://wiki.openstreetmap.org/wiki/Vector_tiles) t ## Features +* Use your mouse to drag and zoom in and out! * Discover Point-of-Interests around any given location * Highly customizable layer styling with [Mapbox Styles](https://www.mapbox.com/mapbox-gl-style-spec/) support * Connect to any public or private vector tile server @@ -13,7 +14,6 @@ A node.js based [Vector Tile](http://wiki.openstreetmap.org/wiki/Vector_tiles) t * Work offline and discover local [VectorTile](https://github.com/mapbox/vector-tile-spec)/[MBTiles](https://github.com/mapbox/mbtiles-spec) * Compatible with most Linux and OSX terminals * Highly optimizied algorithms for a smooth experience -* Use your mouse to drag and zoom in and out (WIP) * 100% pure Coffee-/JavaScript! :sunglasses: ## How to install diff --git a/package.json b/package.json index 4f423d3..2af2d63 100644 --- a/package.json +++ b/package.json @@ -14,8 +14,8 @@ "bin": { "mapscii": "./bin/mapscii.sh" }, - "engines" : { - "node" : ">=4.5.0" + "engines": { + "node": ">=4.5.0" }, "keywords": [ "map", diff --git a/src/Mapscii.coffee b/src/Mapscii.coffee index 73a6247..ef1ef24 100644 --- a/src/Mapscii.coffee +++ b/src/Mapscii.coffee @@ -98,40 +98,58 @@ module.exports = class Mapscii @renderer.setSize @width, @height - _onClick: (event) -> - if @mouseDragging and event.button is "left" - # TODO lat/lng based drag&drop - # @view[0] -= (@mouseDragging.x-@mousePosition.x)<<1 - # @view[1] -= (@mouseDragging.y-@mousePosition.y)<<2 - @_draw() + _updateMousePosition: (event) -> + projected = + x: (event.x-.5)*2 + y: (event.y-.5)*4 + size = utils.tilesizeAtZoom @zoom + [dx, dy] = [projected.x-@width/2, projected.y-@height/2] + + z = utils.baseZoom @zoom + center = utils.ll2tile @center.lon, @center.lat, z + @mousePosition = utils.tile2ll center.x+(dx/size), center.y+(dy/size), z + + _onClick: (event) -> + @_updateMousePosition event + + if @mouseDragging and event.button is "left" @mouseDragging = false + else + @setCenter @mousePosition.lat, @mousePosition.lon + + @_draw() _onMouseScroll: (event) -> + @_updateMousePosition event # TODO: handle .x/y for directed zoom - @zoomBy config.zoomStep * if event.button is "up" then -1 else 1 + @zoomBy config.zoomStep * if event.button is "up" then 1 else -1 @_draw() _onMouseMove: (event) -> - projected = - x: event.x * 2 - y: event.y * 4 - # start dragging if event.button is "left" if @mouseDragging - # TODO lat/lng based drag&drop - # @view[0] -= (@mouseDragging.x-event.x)<<1 - # @view[1] -= (@mouseDragging.y-event.y)<<2 + dx = (@mouseDragging.x-event.x)*2 + dy = (@mouseDragging.y-event.y)*4 + + size = utils.tilesizeAtZoom @zoom + + newCenter = utils.tile2ll @mouseDragging.center.x+(dx/size), + @mouseDragging.center.y+(dy/size), + utils.baseZoom(@zoom) + + @setCenter newCenter.lat, newCenter.lon + + @_draw() - if not @renderer.isDrawing and @renderer.lastDrawAt < Date.now()-100 - @_draw() - @mouseDragging = x: event.x, y: event.y else - @mouseDragging = x: event.x, y: event.y + @mouseDragging = + x: event.x, + y: event.y, + center: utils.ll2tile @center.lon, @center.lat, utils.baseZoom(@zoom) - # update internal mouse tracker - @mousePosition = projected + @_updateMousePosition event @notify @_getFooter() _onKey: (key) -> @@ -182,7 +200,7 @@ module.exports = class Mapscii "center: #{utils.digits @center.lat, 3}, #{utils.digits @center.lon, 3} "+ "zoom: #{utils.digits @zoom, 2} "+ - "mouse: #{@mousePosition.x-@width/2} #{@mousePosition.y-@height/2} " + "mouse: #{utils.digits @mousePosition.lat, 3}, #{utils.digits @mousePosition.lon, 3} " notify: (text) -> @_write "\r\x1B[K"+text unless config.headless diff --git a/src/Renderer.coffee b/src/Renderer.coffee index 1039156..51da171 100644 --- a/src/Renderer.coffee +++ b/src/Renderer.coffee @@ -66,7 +66,7 @@ module.exports = class Renderer frame _visibleTiles: (center, zoom) -> - z = Math.min config.tileRange, Math.max 0, Math.floor zoom + z = utils.baseZoom zoom center = utils.ll2tile center.lon, center.lat, z tiles = [] diff --git a/src/utils.coffee b/src/utils.coffee index 88d1a5a..bf6fdfc 100644 --- a/src/utils.coffee +++ b/src/utils.coffee @@ -13,9 +13,11 @@ utils = clamp: (num, min, max) -> if num <= min then min else if num >= max then max else num + baseZoom: (zoom) -> + Math.min config.tileRange, Math.max 0, Math.floor zoom + tilesizeAtZoom: (zoom) -> - baseZoom = Math.min config.tileRange, Math.floor Math.max 0, zoom - config.projectSize * Math.pow(2, zoom-baseZoom) + config.projectSize * Math.pow(2, zoom-utils.baseZoom(zoom)) deg2rad: (angle) -> # (angle / 180) * Math.PI