Question

我正在尝试为显示屏创建我的Mapbox地图的离线版本。我设法下载了磁贴并将它们放在文件夹中，但对于gridLayer来说并不容易。 gridLayer在Mapbox代码中加载了AJAX，当脚本在本地托管时不允许这样做。

但是在Mapbox文档中，它提到gridLayer可以加载TileJSON对象 - 但问题是，这个文件的格式是什么，我该如何下载它来自我的Mapbox帐户？

非常感谢任何帮助！

Answer 1

让它工作，以备将来参考：

    var gridLayer = L.mapbox.gridLayer();
    gridLayer._getTile = function(z, x, y, callback) {
        var key = z + '_' + x + '_' + y,
        tilePoint = L.point(x, y);

        tilePoint.z = z;

        if (!this._tileShouldBeLoaded(tilePoint)) {
            return;
        }

        if (key in this._cache) {
            if (!callback) return;

            if (typeof this._cache[key] === 'function') {
                callback(this._cache[key]); // Already loaded
            } else {
                this._cache[key].push(callback); // Pending
            }
            return;
        }

        this._cache[key] = [];

        if (callback) {
            this._cache[key].push(callback);
        }


        // get gridJSON - custom hack
        var gridUrl = this._getTileURL(tilePoint);    
        var json = gridJSON[gridUrl];
        var callbacks = this._cache[key];
        this._cache[key] = grid(json);
        for (var i = 0; i < callbacks.length; ++i) {
            callbacks[i](this._cache[key]);
        }

    }
    function utfDecode(c) {
        if (c >= 93) c--;
        if (c >= 35) c--;
        return c - 32;
    }
    var grid = function(data) {
        return function(x, y) {
            if (!data) return;
            var idx = utfDecode(data.grid[y].charCodeAt(x)),
                key = data.keys[idx];
            return data.data[key];
        };
    };


    // gridLayer options
    var options = {
        "grids": ["z{z}x{x}y{y}"],
        "template": "{{#__location__}}{{\/__location__}}{{#__teaser__}}<strong>Havbruk i Bodøregionen<\/strong><br\/>\n{{#ID}}\n<strong>Activity: <\/strong>{{{ID}}}.<br\/>\n{{\/ID}}\n{{#NAME}}\n<strong>Company: <\/strong>{{{NAME}}}<br\/>\n{{\/NAME}}\n{{\/__teaser__}}{{#__full__}}{{\/__full__}}",
    }

    // add gridLayer/control
    gridLayer._setTileJSON(options)
    gridLayer.addTo(map);
    map.addControl(L.mapbox.gridControl(gridLayer));

gridJSON是一个包含这样的条目的对象（从Mapbox中删除）：

var gridJSON = {
          "z8x137y62": {
            "grid": [
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                                ",
              "                                                          !!!   ",
              "                                                         !!!!#  ",
              "                                                         !!!!###",
              "                                                          !!!###",
              "                                                     $$$   !####",
              "                                                    $$$$    %## ",
              "                                                    &&$$     #  ",
              "                                                   &&&&$        ",
              "                                                   &&&&         ",
              "                                                   &&&        '(",
              "                                                    &&       '))"
            ],
            "keys": [
              "",
              "1",
              "2",
              "3",
              "4",
              "5",
              "6",
              "7",
              "8"
            ],
            "data": {
              "1": {
                "ID": "Slakteri",
                "NAME": "Salten N950",
                "__layer__": 0,
                "__l0__": 1
              },
              "2": {
                "ID": "Matfisk",
                "NAME": "Nova Sea",
                "__layer__": 0,
                "__l0__": 1
              },
              "3": {
                "ID": "Matfisk",
                "NAME": "Marine Harvest",
                "__layer__": 0,
                "__l0__": 1
              },
              "4": {
                "ID": "Matfisk",
                "NAME": "Nova Sea",
                "__layer__": 0,
                "__l0__": 1
              },
              "5": {
                "ID": "Matfisk",
                "NAME": "Marine Harvest",
                "__layer__": 0,
                "__l0__": 1
              },
              "6": {
                "ID": "Matfisk",
                "NAME": "GIFAS",
                "__layer__": 0,
                "__l0__": 1
              },
              "7": {
                "ID": "Matfisk",
                "NAME": "GIFAS",
                "__layer__": 0,
                "__l0__": 1
              },
              "8": {
                "ID": "Undervisning og FOU",
                "NAME": "Meløy VGS avd. Inndyr",
                "__layer__": 0,
                "__l0__": 1
              }
            }
          },

如何从Mapbox本地（离线）加载gridLayer？

1 个答案: