使用 Bing Maps Quadkeys 作为 Openlayers 3 Tile 源

我有许多图块源，它们在旧的 Silverlight 应用程序中使用 Bing Maps 的 Quadkey 系统，我想在新的 Openlayers 3 地图中使用它们。

我找到了几个函数示例，这些函数会将这些源转换为 Leaflet.js，但 OL3 的语法有些不同，阅读 API 文档表明有一个 ol.Tile.coord 类，但如果我理解正确的话，这是一个实验性的功能，并且可能需要从源代码进行自定义构建。

GitHub 页面上有对此类功能的引用，但我不知道是否必须使用此源编译构建：https://github.com/openlayers/ol3/blob/5c5364bbb7e8df76f18242ad665c87ca08a76e76/src/ol/source/bingmapssource.js

任何人都可以提供这种类型转换的示例，或者确实有人知道最新（3.8.2）版本的 OL3 是否支持四键方法？

这是传单示例：

var BingLayer = L.TileLayer.extend({
getTileUrl: function (tilePoint) {
    this._adjustTilePoint(tilePoint);
    return L.Util.template(this._url, {
        s: this._getSubdomain(tilePoint),
        q: this._quadKey(tilePoint.x, tilePoint.y, this._getZoomForUrl())
    });
},
_quadKey: function (x, y, z) {
    var quadKey = [];
    for (var i = z; i > 0; i--) {
        var digit = '0';
        var mask = 1 << (i - 1);
        if ((x & mask) != 0) {
            digit++;
        }
        if ((y & mask) != 0) {
            digit++;
            digit++;
        }
        quadKey.push(digit);
    }
    return quadKey.join('');
}
});

这是现有的 Silverlight 代码：

public override Uri GetUri(int x, int y, int zoomLevel, bool getPrintLink)
    {
        Uri uri = null;
        if (this.Covers(x, y, zoomLevel))
        {
            QuadKey qk = new QuadKey(x, y, zoomLevel);
            if (getPrintLink)
            {
                uri = new Uri(this.CurrentHostURL + "/tiles/NL/" + zoomLevel.ToString() + "/" + qk.Key + ".ipic", UriKind.RelativeOrAbsolute);
            }
            else
            {
                uri = new Uri("http://tileserver.satmap.com/NL/" + zoomLevel.ToString() + "/" + qk.Key + ".ipic", UriKind.RelativeOrAbsolute);
            }
        }
        return uri;
    }

任何见解将不胜感激，因为我已经浏览了许多论坛和无数页的搜索结果，但没有找到解决方案。

据我所知，您的 _quadKey 函数是正确的。可能出现的问题是理解ol.TileCoord提供给 URL 函数。

在 OpenLayers 3.7 及更高版本中，所有TileCoords 以左上角为原点计算。此外，X和Y坐标都会自然增加，因此TileCoord的X和Y坐标对应于二维轴的正常概念。

给定缩放级别的左上角图块将始终具有 X=0 和 Y=-1。下面的图块将具有 X=0 和 Y=-2； Y 永远为负数。

某些地图应用程序（例如 Bing）也使用左上角作为图块原点，但让Y坐标向下增加。左上角的图块将是 X=0 和 Y=0，而下面的图块将是 X=0 和 Y=1。

为了计算四键，必须反转 Y 坐标并调整 1。这应该有效:

// this is unchanged from the question
var quadkey = function (x, y, z) {
    var quadKey = [];
    for (var i = z; i > 0; i--) {
        var digit = '0';
        var mask = 1 << (i - 1);
        if ((x & mask) != 0) {
            digit++;
        }
        if ((y & mask) != 0) {
            digit++;
            digit++;
        }
        quadKey.push(digit);
    }
    return quadKey.join('');
};

var quadKeyLayer = new ol.layer.Tile({
    source: new ol.source.XYZ({
        maxZoom: 19,
        tileUrlFunction: function (tileCoord, pixelRatio, projection) {
            var z = tileCoord[0];
            var x = tileCoord[1];
            var y = -tileCoord[2] - 1;
            return "//example.com/r" + quadkey(x, y, z);
        }
    })
});