diff --git a/js/id/id.js b/js/id/id.js index 828aa45f9..afcdfc3e4 100644 --- a/js/id/id.js +++ b/js/id/id.js @@ -209,8 +209,7 @@ window.iD = function(container) { var hash = iD.Hash().map(map); if (!hash.hadHash) { - map.zoom(20) - .center([-77.02271,38.90085]); + map.centerZoom([-77.02271, 38.90085], 20); } d3.select('.user-container').call(iD.ui.userpanel(connection) diff --git a/js/id/renderer/hash.js b/js/id/renderer/hash.js index 05691ef59..bb454811b 100644 --- a/js/id/renderer/hash.js +++ b/js/id/renderer/hash.js @@ -1,5 +1,5 @@ iD.Hash = function() { - var hash = {}, + var hash = { hadHash: false }, s0, // cached location.hash lat = 90 - 1e-8, // allowable latitude range map; @@ -10,8 +10,9 @@ iD.Hash = function() { if (args.length < 3 || args.some(isNaN)) { return true; // replace bogus hash } else { - map.zoom(args[0]) - .center([args[2], Math.min(lat, Math.max(-lat, args[1]))]); + map.centerZoom([args[2], + Math.min(lat, Math.max(-lat, args[1]))], + args[0]); } }; @@ -27,12 +28,13 @@ iD.Hash = function() { var move = _.throttle(function() { var s1 = formatter(map); if (s0 !== s1) location.replace(s0 = s1); // don't recenter the map! - }, 1000); + }, 100); function hashchange() { if (location.hash === s0) return; // ignore spurious hashchange events - if (parser(map, (s0 = location.hash).substring(2))) + if (parser(map, (s0 = location.hash).substring(2))) { move(); // replace bogus hash + } } hash.map = function(x) { diff --git a/js/id/renderer/map.js b/js/id/renderer/map.js index a21a8a2d0..75043a1f8 100644 --- a/js/id/renderer/map.js +++ b/js/id/renderer/map.js @@ -161,7 +161,7 @@ iD.Map = function() { redraw(); } - function redraw(difference) { + var redraw = _.throttle(function(difference) { dispatch.move(map); surface.attr('data-zoom', ~~map.zoom()); tilegroup.call(background); @@ -172,7 +172,7 @@ iD.Map = function() { editOff(); } return map; - } + }, 10); function pointLocation(p) { var translate = projection.translate(), @@ -207,10 +207,7 @@ iD.Map = function() { return map; }; - map.zoom = function(z) { - if (!arguments.length) { - return Math.max(Math.log(projection.scale()) / Math.LN2 - 8, 0); - } + function setZoom(z) { var scale = 256 * Math.pow(2, z), center = pxCenter(), l = pointLocation(center); @@ -223,8 +220,17 @@ iD.Map = function() { t[1] += center[1] - l[1]; projection.translate(t); zoom.translate(projection.translate()); - return redraw(); - }; + } + + function setCenter(loc) { + var t = projection.translate(), + c = pxCenter(), + ll = projection(loc); + projection.translate([ + t[0] - ll[0] + c[0], + t[1] - ll[1] + c[1]]); + zoom.translate(projection.translate()); + } map.size = function(_) { if (!arguments.length) return dimensions; @@ -244,17 +250,25 @@ iD.Map = function() { if (!arguments.length) { return projection.invert(pxCenter()); } else { - var t = projection.translate(), - c = pxCenter(), - ll = projection(loc); - projection.translate([ - t[0] - ll[0] + c[0], - t[1] - ll[1] + c[1]]); - zoom.translate(projection.translate()); + setCenter(loc); return redraw(); } }; + map.zoom = function(z) { + if (!arguments.length) { + return Math.max(Math.log(projection.scale()) / Math.LN2 - 8, 0); + } + setZoom(z); + return redraw(); + }; + + map.centerZoom = function(loc, z) { + setCenter(loc); + setZoom(z); + return redraw(); + }; + map.centerEase = function(loc) { var from = map.center().slice(), t = 0; d3.timer(function() { @@ -279,7 +293,7 @@ iD.Map = function() { vZoomDiff = Math.log(Math.abs(vFactor)) / Math.LN2, newZoom = map.zoom() - Math.max(hZoomDiff, vZoomDiff); - map.zoom(newZoom).center(extent.center()); + map.centerZoom(extent.center(), newZoom); } };