diff --git a/modules/services/mapillary.js b/modules/services/mapillary.js index cdf04aa3b..4d19f43af 100644 --- a/modules/services/mapillary.js +++ b/modules/services/mapillary.js @@ -23,7 +23,7 @@ import { svgDefs } from '../svg'; import { utilDetect } from '../util/detect'; import { utilQsString, utilRebind, utilTile } from '../util'; -var geoTile = utilTile(); +var geoTile = utilTile().skipNullIsland(true); var apibase = 'https://a.mapillary.com/v3/'; var viewercss = 'mapillary-js/mapillary.min.css'; @@ -86,7 +86,6 @@ function loadTiles(which, url, projection) { var dimension = projection.clipExtent()[1]; var tiles = geoTile.getTiles(projection, dimension, tileZoom, 0); - tiles = geoTile.filterNullIsland(tiles); geoTile.removeInflightRequests(which, tiles, abortRequest, ',0'); diff --git a/modules/services/openstreetcam.js b/modules/services/openstreetcam.js index 73483dddc..89b391022 100644 --- a/modules/services/openstreetcam.js +++ b/modules/services/openstreetcam.js @@ -33,7 +33,7 @@ import { utilSetTransform } from '../util'; -var geoTile = utilTile(); +var geoTile = utilTile().skipNullIsland(true); var apibase = 'https://openstreetcam.org'; var maxResults = 1000; @@ -81,7 +81,6 @@ function loadTiles(which, url, projection) { var dimension = projection.clipExtent()[1]; var tiles = geoTile.getTiles(projection, dimension, tileZoom, 0); - tiles = geoTile.filterNullIsland(tiles); geoTile.removeInflightRequests(which, tiles, abortRequest, ',0'); diff --git a/modules/services/osm.js b/modules/services/osm.js index 4263662e2..d7686ce34 100644 --- a/modules/services/osm.js +++ b/modules/services/osm.js @@ -780,7 +780,6 @@ export default { // get tiles var tiles = geoTile.getTiles(projection, dimensions, tilezoom, 0); - tiles = geoTile.filterNullIsland(tiles); // remove inflight requests that no longer cover the view.. var hadRequests = !_isEmpty(cache.inflight); diff --git a/modules/services/streetside.js b/modules/services/streetside.js index 52ee2c14f..435d0c210 100644 --- a/modules/services/streetside.js +++ b/modules/services/streetside.js @@ -32,7 +32,7 @@ import { utilQsString, utilRebind, utilTile } from '../util'; import Q from 'q'; -var geoTile = utilTile(); +var geoTile = utilTile().skipNullIsland(true); var bubbleApi = 'https://dev.virtualearth.net/mapcontrol/HumanScaleServices/GetBubbles.ashx?'; var streetsideImagesApi = 'https://t.ssl.ak.tiles.virtualearth.net/tiles/'; @@ -95,8 +95,9 @@ function loadTiles(which, url, projection, margin) { var currZoom = Math.floor(Math.max(Math.log(s) / Math.log(2) - 8, 0)); var dimension = projection.clipExtent()[1]; - var tiles = geoTile.getTiles(projection, dimension, tileZoom, margin); - tiles = geoTile.filterNullIsland(tiles); + var tiles = geoTile + .margin(margin) + .getTiles(projection, dimension, tileZoom); tiles.forEach(function (tile) { loadNextTilePage(which, currZoom, url, tile); diff --git a/modules/util/tile.js b/modules/util/tile.js index 2179525f7..2ed2474e2 100644 --- a/modules/util/tile.js +++ b/modules/util/tile.js @@ -11,11 +11,14 @@ export function utilTile() { var _translate = [_size[0] / 2, _size[1] / 2]; var _zoomDelta = 0; var _margin = 0; + var _skipNullIsland = false; + function bound(val) { return Math.min(_scaleExtent[1], Math.max(_scaleExtent[0], val)); } + function nearNullIsland(x, y, z) { if (z >= 7) { var center = Math.pow(2, z - 1); @@ -27,7 +30,8 @@ export function utilTile() { return false; } - function tile() { + + function tiler() { var z = Math.max(Math.log(_scale) / Math.LN2 - 8, 0); var z0 = bound(Math.round(z + _zoomDelta)); var k = Math.pow(2, z - z0 + 8); @@ -72,13 +76,7 @@ export function utilTile() { * Using d3.geo.tiles.js from lib, gets tile extents for each grid tile in a grid created from * an area around (and including) the current map view extents. */ - tile.getTiles = function(projection, dimensions, tilezoom, margin) { - - // s is the current map scale - // z is the 'Level of Detail', or zoom-level, where Level 1 is far from the earth, and Level 23 is close to the ground. - // ts ('tile size') here is the formula for determining the width/height of the map in pixels, but with a modification. - // See 'Ground Resolution and Map Scale': //https://msdn.microsoft.com/en-us/library/bb259689.aspx. - // As used here, by subtracting constant 'tileZoom' from z (the level), you end up with a much smaller value for the tile size (in pixels). + tiler.getTiles = function(projection, dimensions, tilezoom) { var s = projection.scale() * 2 * Math.PI; var z = Math.max(Math.log(s) / Math.log(2) - 8, 0); var ts = 256 * Math.pow(2, z - tilezoom); @@ -87,18 +85,19 @@ export function utilTile() { s / 2 - projection.translate()[1] ]; - var tiler = this + this .scaleExtent([tilezoom, tilezoom]) .scale(s) .size(dimensions) - .translate(projection.translate()) - .margin(margin || 0); // request nearby tiles so we can connect sequences. + .translate(projection.translate()); - var tiles = tiler() + return tiler() .map(function(tile) { + if (_skipNullIsland && nearNullIsland(tile[0], tile[1], tile[2])) { + return false; + } var x = tile[0] * ts - origin[0]; var y = tile[1] * ts - origin[1]; - return { id: tile.toString(), xyz: tile, @@ -107,21 +106,12 @@ export function utilTile() { projection.invert([x + ts, y]) ) }; - }); - - return tiles; - }; - - - tile.filterNullIsland = function(tiles) { - return tiles.filter(function(t) { - return !nearNullIsland(t.xyz[0], t.xyz[1], t.xyz[2]); - }); + }).filter(Boolean); }; // remove inflight requests that no longer cover the view.. - tile.removeInflightRequests = function(cache, tiles, callback, modifier) { + tiler.removeInflightRequests = function(cache, tiles, callback, modifier) { return _filter(cache.inflight, function(v, i) { var wanted = _find(tiles, function(tile) { return i === tile.id + modifier; }); if (!wanted) { @@ -132,48 +122,54 @@ export function utilTile() { }; - tile.scaleExtent = function(val) { + tiler.scaleExtent = function(val) { if (!arguments.length) return _scaleExtent; _scaleExtent = val; - return tile; + return tiler; }; - tile.size = function(val) { + tiler.size = function(val) { if (!arguments.length) return _size; _size = val; - return tile; + return tiler; }; - tile.scale = function(val) { + tiler.scale = function(val) { if (!arguments.length) return _scale; _scale = val; - return tile; + return tiler; }; - tile.translate = function(val) { + tiler.translate = function(val) { if (!arguments.length) return _translate; _translate = val; - return tile; + return tiler; }; - tile.zoomDelta = function(val) { + tiler.zoomDelta = function(val) { if (!arguments.length) return _zoomDelta; _zoomDelta = +val; - return tile; + return tiler; }; - // number to extend the rows/columns beyond those covering the viewport - tile.margin = function(val) { + tiler.margin = function(val) { if (!arguments.length) return _margin; _margin = +val; - return tile; + return tiler; }; - return tile; + tiler.skipNullIsland = function(val) { + if (!arguments.length) return _skipNullIsland; + _skipNullIsland = val; + return tiler; + }; + + + return tiler; }