Update code to Leaflet 1.0.0-b1

[cmulders]

The current codebase is not compatible anymore with Leaflet 1.0.0, as many things have changed. I needed the Zoomify plugin for a project and updated the plugin.

I am happy to share my update of the code, if you like the changes I made.

• The url now uses the url-templater, injecting the TileGroup number as variable ({g})
• The tile creation is now done by L.GridLayer and L.TileLayer, and only the size is changed if the tile is on a edge (often having arbitrary tile dimensions)
• The view is not set anymore, but the bounds are exposed in layer.options.bounds, and could be used with map.fitBounds(layer.options.bounds) to center and zoom the Zoomify layer in the viewport
• The Zoomify layer can be zoomed beyond available zoom levels by setting the options.maxNativeZoom option accordingly, making it possible for L.TileLayer to scale the tiles accordingly

[GeneGIGA]

The re-write of the plugin looks great. Many thanks for the update!

I found one issue with the update. The bounds are set for a map called "map" but if the main map layer is named something else, it fails to set the bounds, etc.

    var southWest = map.unproject([0,maxZoomGrid.y*tileSize], options.maxNativeZoom);
    var northEast = map.unproject([maxZoomGrid.x*tileSize,0], options.maxNativeZoom);

I ended up setting the bounds outside of the plugin after it initializes...but there is likely a better way that you might know of.

[crunchorn]

@GeneGIGA map is passed as a parameter (this is behavior provided by the base class) so issue might be rather a way those boundaries are calculated. Current code assumes that your image dimensions are multiple of 256 (tile size), if they are not - right/bottom part will look "blank" when you for example decide to use getBounds() in setMaxBounds() method of your map/viewport. Possible solution might be to change this part of the beforeAdd method:

maxX = maxZoomGrid.x * this.options.tileSize,
maxY = maxZoomGrid.y * this.options.tileSize,
southEast = map.unproject([maxX, maxY], maxNativeZoom);
this.options.bounds = new L.LatLngBounds([[0, 0], southEast]);

Into:

southEast = map.unproject([0, this.options.height], maxNativeZoom),
northEast = map.unproject([this.options.width, 0], maxNativeZoom);
this.options.bounds = new L.LatLngBounds([northEast, southEast]);

Where image size data is used instead of multipliers of tile size and zoom.

[GeneGIGA]

I removed the set bounds in the initialization step and moved it to a beforeAdd function, then it seems happy...

beforeAdd: function (map) {
// get the options currently set during initialization
var options = L.setOptions(this, options);

    //Register our bounds for this zoomify layer based on the maximum zoom
    var maxZoomGrid = this._gridSize[options.maxNativeZoom];
    var southWest = map.unproject([0,maxZoomGrid.y*options.tileSize], options.maxNativeZoom);
    var northEast = map.unproject([maxZoomGrid.x*options.tileSize,0], options.maxNativeZoom);

    // Set the bounds
    options.bounds = new L.LatLngBounds(southWest, northEast);

    // fit the bounds for the map
    map.fitBounds(this.options.bounds);
},

[janeschindler]

I'm wondering why you multiplied the number of tiles by the tile size to get the southWest and northEast borders. They seem to correspond to the size of the original images in options.height and options.width. I substituted those and got rid of the borders around my image. fitBounds() works exactly now.
var southWest = map.unproject([0,options.height], options.maxNativeZoom); var northEast = map.unproject([options.width,0], options.maxNativeZoom);
I'd be interested to know if this is going to be problematic for me later, or if it's better that way. Thanks.

[Fil]

I can confirm that the PR works, if you use beforeAdd: as per #7 (comment)

[Andreas-Schoenefeldt]

Is there any chance to merge this, and make it work with a contemporary leaflet version?

[turban]

Unfortunately, I don't have time to maintain this repo - if someone wants to take over, please tell me and I can transfer the repo.

[nathanjss]

The beforeAdd works great, however I had to remove the
// fit the bounds for the map
map.fitBounds(this.options.bounds);
at the end of the initialize function as I was switching between base layers and the zoom was resetting each time the layer was changed. I would suggest that this should not be part of the class as it is a usage option and has nothing to do with generating a TileLayer from a Zoomify folder. If someone wants to fit the map to the bounds of the full image, they should do so in their own application outside of the TileLayer generation.