jQuery Geo interactive zoom bug

by ryanttb

HTML

<script src="http://code.jquerygeo.com/jquery.geo-1.0.0-b1.5.min.js"></script>
<div id="map"></div>
<div id="zoom">
    Zoom: <span class="value"></span><br/>
    <span class="zoom-out">-</span>
    <span class="zoom-in">+</span>
</div>

CSS

#zoom {
    position: absolute;
    background-color: #fff;
    padding: 5px;
    top: 5px;
    left: 5px;
    border: 1px solid #ddd;
}

#zoom .zoom-in, #zoom .zoom-out {
    cursor: pointer;
    font-weight: bold;
    font-size: 2em;
    padding: 0 10px;
    background-color: #eee;
    border: 1px solid #ddd;
}

JavaScript

$.geo.proj = null;
var map = $("#map").geomap({
  services: [
    {
      id: "nbig-basemap",
      type: "tiled",
      src: "http://njwebmaptest.state.nj.us/ArcGIS/rest/services/Basemap/basemap/MapServer/tile/{{:zoom}}/{{:tile.row}}/{{:tile.column}}"
    }
  ],
  tilingScheme: {
    tileWidth: 512,
    tileHeight: 512,
    pixelSizes: [
      3472.22222222222,
      2604.16666666667, // .75
      2170.13888888889, // .75
      1562.5, // .72
      976.5625, // .625
      494.791666666667, // .50667
      260.416666666667, // .526315
      130.208333333333, // .499
      65.1041666666667, // .500
      32.5520833333333, // .499
      21.7013888888889, // .667
      10.8506944444444, // .499
      5.20833333333333,
      2.08333333333333,
      1.04166666666667
    ],
    origin: [-842000, 1440000]
  },
  bbox: [178572.56084636107, 24756.696718111576, 681617.2227042825, 932311.499039104],
  bboxchange: updateZoom
});

updateZoom();

function updateZoom(e, geo) {
    $("#zoom .value").text(map.geomap("option", "zoom"));
}

$("#zoom .zoom-in").on("click", function() {
    var zoom = map.geomap("option", "zoom");
    map.geomap("option", "zoom", zoom + 1);
    updateZoom();
});

$("#zoom .zoom-out").on("click", function() {
    var zoom = map.geomap("option", "zoom");
    map.geomap("option", "zoom", zoom - 1);
    updateZoom();
});