javascript - 传单如何加载自定义规则的瓦片地图？

Question

现在本地有一张自定义瓦片规则的地图。已经有可以正常调用的自定义JavaScript库了。现在我需要用传单替换这个库。如何使用旧 JavaScript 库和小册子中的算法进行瓦片地图法线调用？

瓦片地图投影规则是墨卡托投影。瓷砖尺寸不规则。宽度为 256 像素。每条线的高度相同，但不同的线高是不同的。旧的 JavaScript 库定义了椭球参数。各种级别的尺度、排名数的计算规则等等，现在想用leaflet来加载这些瓦片图，怎么用老的规则和leaflet的组合呢？

MapBase 定义了各种基本参数，loadMapImage 是一个关键函数

function LoadMapImage() {
    var tileLoadInfo = mapBase.getViewInfo();
    MapInfo.Map.basemapslicedlayer.empty();
    for (var i = 0; i < tileLoadInfo.TileInfo.length; i++) {
        if (MapInfo.Map.Tiles[tileLoadInfo.TileInfo[i].Col + "_" + tileLoadInfo.TileInfo[i].Row + "_" + tileLoadInfo.Mode] == undefined) {
            if (tileLoadInfo.Mode == 6) {
                var src = DNCOptions.url + "&" + DNCOptions.paramX + "=" + tileLoadInfo.TileInfo[i].Row + "&" + DNCOptions.paramY + "=" + tileLoadInfo.TileInfo[i].Col + "&" + DNCOptions.paramZ + "=" + tileLoadInfo.TileInfo[i].Level + "&SessionID=" + WinfoDNCSessionID
            } else if (tileLoadInfo.Mode == 8 || tileLoadInfo.Mode == 9) {
                var level = tileLoadInfo.Level + 2;
                if (tileLoadInfo.Mode == 9) {
                    level = tileLoadInfo.Level - 3
                }
                src = MapInfo.ServicePath + "?REQUEST=GetMap&SERVICE=CacheMap&Y=" + tileLoadInfo.TileInfo[i].Col + "&X=" + tileLoadInfo.TileInfo[i].Row + "&LEVEL=" + level + "&LAYERS=" + DNCOptions.layername + "&SessionID=" + WinfoDNCSessionID
            } else {
                var src = MapInfo.ServicePath + "?REQUEST=GetMap&SERVICE=WINFODNC&X=" + tileLoadInfo.TileInfo[i].Col + "&Y=" + tileLoadInfo.TileInfo[i].Row + "&LEVEL=" + tileLoadInfo.Level + "&LAYERS=" + tileLoadInfo.Mode + "&SessionID=" + WinfoDNCSessionID
            }
            MapInfo.Map.Tiles[tileLoadInfo.TileInfo[i].Col + "_" + tileLoadInfo.TileInfo[i].Row + "_" + tileLoadInfo.Mode] = w$("<img>").css({
                position: "absolute",
                left: tileLoadInfo.TileInfo[i].Offset_x,
                top: tileLoadInfo.TileInfo[i].Offset_y
            }).attr("src", src)
        }
        MapInfo.Map.basemapslicedlayer.append(MapInfo.Map.Tiles[tileLoadInfo.TileInfo[i].Col + "_" + tileLoadInfo.TileInfo[i].Row + "_" + tileLoadInfo.Mode].css({
            position: "absolute",
            left: tileLoadInfo.TileInfo[i].Offset_x,
            top: tileLoadInfo.TileInfo[i].Offset_y
        }))
    }
}

    function GetTileInfoByViewportParam(vp) {
        var Box = {};
        var i, row1, row2, col1, col2, hTileSize;
        var L, R, T, B;
        var LT = ScreenPoint2Coordinate(vp, 0, 0);
        Box.Top = LT[0];
        Box.Left = LT[1];
        var RB = ScreenPoint2Coordinate(vp, vp.Width, vp.Height);
        Box.Bottom = RB[0];
        Box.Right = RB[1];
        var rc = CalculateTile(LevelZeroTileSizeDegrees, Box, vp.Level);
        row1 = rc[0];
        row2 = rc[2];
        col1 = rc[1];
        col2 = rc[3];
        var LRTB = CalculateTileExtend(LevelZeroTileSizeDegrees, vp.Level, row1, col1);
        L = LRTB[0];
        R = LRTB[1];
        T = LRTB[2];
        B = LRTB[3];
        var Offset = Coordinate2ScreenPoint(vp, T, L);
        vp.Offset_x = Offset[0];
        vp.Offset_y = Offset[1];
        MapViewInfo.Level = vp.Level;
        MapViewInfo.Box = Box;
        i = 0;
        var offsety = vp.Offset_y;
        MapViewInfo.TileInfo = [];
        for (var j = row1; j >= row2; j--) {
            hTileSize = CalculateTileSize(vp.Level, j, col1);
            var offsetx = vp.Offset_x;
            for (var z = col1; z <= col2; z++) {
                var tileInfo = {};
                tileInfo.Row = j;
                tileInfo.Col = z;
                tileInfo.Height = hTileSize;
                tileInfo.Widht = TileSize;
                tileInfo.Offset_x = offsetx;
                tileInfo.Offset_y = offsety;
                offsetx += TileSize;
                MapViewInfo.TileInfo[i] = tileInfo;
                i++
            }
            offsety += hTileSize
        }
        return MapViewInfo
    };

按照leaflet默认的初始化map方法，参数只能检索到空白tile。

标签： javascriptleaflet