如何将 .mbtiles 文件中的tile_data设置为传单的图块？

我正在使用meteorjs 和cordova 开发一个混合移动应用程序。应用程序需要有离线地图支持。我使用 Maperitive 导出了一个可以离线查看的 .mbtiles 文件，并将该文件复制到我的应用程序中，以便我可以在使用 Leaflet 加载图块时访问它。为此，我使用了cordova文件系统插件（将.mbtiles复制到正确的位置）和cordova s​​qlite插件（用于访问.mbtiles数据）并且该部分有效，当传单请求瓦片时，我可以成功加载tile_data z，x和y 。

不起作用的部分是将图块“放置”在地图上。我正在使用自定义图块层来访问 .mbtiles sqlite 数据库并获取所需的图块：

//TilesLayer.MBTiles.js

L.TileLayer.MBTiles = L.TileLayer.extend({
mbTilesDB: null,

initialize: function(url, options, db) {
    this.mbTilesDB = db;
    L.Util.setOptions(this, options);
},
getTileUrl: function (tilePoint, zoom, tile) {
    var z = this._getZoomForUrl();
    var x = tilePoint.x;
    var y = Math.pow(2, z) - tilePoint.y - 1;
    var base64Prefix = "data:image/png;base64,";

    this.mbTilesDB.readTransaction(function(tdx) {
      tdx.executeSql("SELECT tile_data FROM tiles WHERE zoom_level = ? AND tile_column = ? AND tile_row = ?;", [z, x, y], function(tx, res) {

      tile.src = base64Prefix +  res.rows.item(0).tile_data;

       console.log("tile-src" + JSON.stringify(tile.src));
      }, function(tx, error) {
        console.log('SELECT error: ' + error.message);
      });
    }, function(error) {
      console.log('transaction error: ' + error.message);
    }, function() {
      console.log('transaction ok');

    }); 
},
_loadTile: function (tile, tilePoint, zoom) {
    tile._layer = this;
    tile.onload = this._tileOnLoad;
    tile.onerror = this._tileOnError;
    this.getTileUrl(tilePoint, zoom, tile);
} });  

地图上不显示图块。 Leaflet 要求提供正确的图块，这些图块已从数据库成功返回，但未显示。

-也许这一行有问题：

tile.src = base64Prefix +  res.rows.item(0).tile_data;

我是否没有正确使用tile_data？我必须将其转换为其他东西吗？ .mbtiles 文件中的图块存储为 BLOB，但为 .png 图像。

- 当我把瓷砖传回来时，我是否错过了一个电话？ 就像是：

tilelayer.fire('tileloadstart', {
                tile: tile
                });

并在tile.src设置后调用它？

任何帮助将非常感激。