将 FixedZoomLevels 层 OpenLayers 2.13.1 迁移到 OpenLayers 3

Question

我有以下问题。我无法将现有的为 OL 2.13.1 编写的自定义层迁移到 OL 3。我不知道如何重新实现 FixedZoomLevels 属性。

OL2 代码：

OpenLayers.Layer.Mapy = OpenLayers.Class(OpenLayers.Layer.Grid,
OpenLayers.Layer.FixedZoomLevels, {

    /** Actual number of server.
      {Integer} 1
     */
    CURRENT_SERVER_INDEX: 1,

    /** Number of servers for load balancing.
     * {Integer} 4
     */
    SERVER_NUMBER: 4,

    /**
     * Constant: MIN_ZOOM_LEVEL
     * {Integer} 3
     */
    MIN_ZOOM_LEVEL: 3,

    /**
     * Constant: MAX_ZOOM_LEVEL
     * {Integer} 16
     */
    MAX_ZOOM_LEVEL: 16,

    RESOLUTIONS: [
        1,    // nepouzito
        1,    // non-used
        1,    // non-used
        131072,
        65536,
        32768,
        16384,
        8192,
        4096,
        2048,
        1024,
        512,
        256,
        128,
        64,
        32,
        16
    ],

    /* This number does not have impact on working */
    maxResolution : 983040,

    minResolution : 16,

    maxExtent : new OpenLayers.Bounds(0, 0, 251658240, 251658240),

    /**
     * APIProperty: isBaseLayer
     */
    isBaseLayer: true,

    /**
     * APIProperty: units
     * {?}
     */
    units: null,

    mapTheme: "base",

    moveTo:function(bounds, zoomChanged, dragging) {
        OpenLayers.Layer.Grid.prototype.moveTo.apply(this, arguments);
    },

    /**
     * Constructor: OpenLayers.Layer.Mapy
     *
     * Parameters:
     * name - {String}
     * options - {Object} Additional options for the layer. Any of the
     *     APIProperties listed on this layer, and any layer types it
     *     extends, can be overridden through the options parameter.
     */
    initialize: function(name, theme, options) {
        OpenLayers.Layer.Grid.prototype.initialize.apply(this, arguments);
        OpenLayers.Layer.FixedZoomLevels.prototype.initialize.apply(this,
            arguments);
        Proj4js.defs["SR-ORG:98"] = "+proj=tmerc +lat_0=0 +lon_0=15 +k=0.9996 +x_0=4200000 +y_0=-1300000 +ellps=WGS84 +datum=WGS84 +to_meter=0.03125 +no_defs";

        this.projection = new OpenLayers.Projection('SR-ORG:98');
        this.mapTheme = (theme == null ? "base" : theme);
    },

    /**
     * http://m{1-4}.mapserver.mapy.cz/{mapTheme}/{z+3}_{hexadecimal(x)_{hexadecimal{y}}}
     * x - left
     * y - bottom
     */
    getURL: function (bounds) {
        var resolution = this.getResolution();

        var zm = this.getZoomForResolution(resolution) + 3;

        var xHex = convertDec2Hex(bounds.left);
        var yHex = convertDec2Hex(bounds.bottom);

        var url = "http://m" + this.CURRENT_SERVER_INDEX + ".mapserver.mapy.cz/" + this.mapTheme + "/" + zm + "_" + xHex + "_" + yHex;

        this.CURRENT_SERVER_INDEX = ((this.CURRENT_SERVER_INDEX) % 4) + 1;

        return url;
    },

    /**
     * Method: addTile
     *
     * Parameters:
     * bounds - {<OpenLayers.Bounds>}
     * position - {<OpenLayers.Pixel>}
     *
     * Returns:
     * {<OpenLayers.Tile.Image>}
     */
    addTile:function(bounds,position) {
        var url = this.getURL(bounds);
        return new OpenLayers.Tile.Image(this, position, bounds,
            url, this.tileSize);
    },

    clone: function (obj) {
  ...
    },
    CLASS_NAME: "OpenLayers.Layer.Mapy"
});

基本上，我正在尝试修改 ol.source.XYZ 以使其正常工作。但是，我现在不知道如何正确设置 TileGrid 以及 minZoom、maxZoom 的分辨率...

OL3 代码：

    var resolutions = [131072,
    65536,
    32768,
    16384,
    8192,
    4096,
    2048,
    1024,
    512,
    256,
    128,
    64,
    32,
    16
];

// Define British National Grid Proj4js projection (copied from http://epsg.io/27700.js)
proj4.defs("SR-ORG:98", "+proj=tmerc +lat_0=0 +lon_0=15 +k=0.9996 +x_0=4200000 +y_0=-1300000 +ellps=WGS84 +datum=WGS84 +to_meter=0.03125 +no_defs");

// Extent of the map in units of the projection (these match our base map)
var extent = [0, 0, 251658240, 251658240];

var center = [135146032, 134632896];

// Define an OL3 projection based on the included Proj4js projection
// definition and set it's extent.
var bng = ol.proj.get('SR-ORG:98');

bng.setExtent(extent);

var map = new ol.Map({
    target: 'map',
    layers: [
        new ol.layer.Tile({
            source: new ol.source.XYZ({
                projection: bng,
                tileUrlFunction : function() ...
...
            })
        })
    ],
    view: new ol.View({
        center: center,
        zoom: 6
    })
});

任何帮助将不胜感激。

谢谢。

Answer 1

据我了解，这应该会有所帮助： 见

var map = new ol.Map({
target: 'map',
layers: [
    new ol.layer.Tile({
        source: new ol.source.XYZ({
            projection: bng,
            tileUrlFunction : function() ...
        })
    })
],
view: new ol.View({
    center: center,
    zoom: 6
    minzoom: 3   <--
    maxzoom: 16  <--
})   
});