Select to view content in your preferred language

WebTileLayer in MapView 2D not triggering any network requests (offline tiles via Node/Express)

97
1
4 weeks ago
Espada4
New Contributor

 

Hi everyone,

I'm trying to render a WebTileLayer inside a MapView using ArcGIS API for JavaScript.

My goal is to use raster tiles completely offline.
The tiles are pre-generated (z/x/y structure) and served locally via a simple Node.js + Express static server.

Tile structure

My tiles are organized like this:

/tiles /0 /1 /2 ... /14 /x y.png
 

Example URL that works directly in the browser:

Tiles are 256x256 PNG in Web Mercator (EPSG:3857).


WebTileLayer configuration

 

const webTileLayer = new WebTileLayer({ urlTemplate: "http://localhost:9000/tiles/{level}/{col}/{row}.png" });
 
 

Then I assign it as the basemap:

this.map.basemap = new Basemap({ baseLayers: [webTileLayer] });
 
 

The SceneView is using Web Mercator spatial reference (3857), and the LODs are standard Web Mercator LODs (0–23). 

i give you the print of my currentLayer

{
    "fullExtent": {
        "spatialReference": {
            "latestWkid": 3857,
            "wkid": 102100
        },
        "xmin": -20037508.342787,
        "ymin": -20037508.34278,
        "xmax": 20037508.34278,
        "ymax": 20037508.342787
    },
    "id": "19c512d415e-layer-1",
    "listMode": "show",
    "title": "Layer",
    "visibility": true,
    "layerType": "WebTiledLayer",
    "minScale": 0,
    "maxScale": 0,
    "refreshInterval": 0,
    "blendMode": "normal",
    "copyright": "",
    "tileInfo": {
        "compressionQuality": 0,
        "dpi": 96,
        "format": "PNG8",
        "origin": {
            "spatialReference": {
                "latestWkid": 3857,
                "wkid": 102100
            },
            "x": -20037508.342787,
            "y": 20037508.342787
        },
        "lods": [
            {
                "level": 0,
                "resolution": 156543.033928,
                "scale": 591657527.591555
            },
            {
                "level": 1,
                "resolution": 78271.5169639999,
                "scale": 295828763.795777
            },
            {
                "level": 2,
                "resolution": 39135.7584820001,
                "scale": 147914381.897889
            },
            {
                "level": 3,
                "resolution": 19567.8792409999,
                "scale": 73957190.948944
            },
            {
                "level": 4,
                "resolution": 9783.93962049996,
                "scale": 36978595.474472
            },
            {
                "level": 5,
                "resolution": 4891.96981024998,
                "scale": 18489297.737236
            },
            {
                "level": 6,
                "resolution": 2445.98490512499,
                "scale": 9244648.868618
            },
            {
                "level": 7,
                "resolution": 1222.99245256249,
                "scale": 4622324.434309
            },
            {
                "level": 8,
                "resolution": 611.49622628138,
                "scale": 2311162.217155
            },
            {
                "level": 9,
                "resolution": 305.748113140558,
                "scale": 1155581.108577
            },
            {
                "level": 10,
                "resolution": 152.874056570411,
                "scale": 577790.554289
            },
            {
                "level": 11,
                "resolution": 76.4370282850732,
                "scale": 288895.277144
            },
            {
                "level": 12,
                "resolution": 38.2185141425366,
                "scale": 144447.638572
            },
            {
                "level": 13,
                "resolution": 19.1092570712683,
                "scale": 72223.819286
            },
            {
                "level": 14,
                "resolution": 9.55462853563415,
                "scale": 36111.909643
            },
            {
                "level": 15,
                "resolution": 4.77731426794937,
                "scale": 18055.954822
            },
            {
                "level": 16,
                "resolution": 2.38865713397468,
                "scale": 9027.977411
            },
            {
                "level": 17,
                "resolution": 1.19432856685505,
                "scale": 4513.988705
            },
            {
                "level": 18,
                "resolution": 0.597164283559817,
                "scale": 2256.994353
            },
            {
                "level": 19,
                "resolution": 0.298582141647617,
                "scale": 1128.497176
            },
            {
                "level": 20,
                "resolution": 0.14929107082380833,
                "scale": 564.248588
            },
            {
                "level": 21,
                "resolution": 0.07464553541190416,
                "scale": 282.124294
            },
            {
                "level": 22,
                "resolution": 0.03732276770595208,
                "scale": 141.062147
            },
            {
                "level": 23,
                "resolution": 0.01866138385297604,
                "scale": 70.5310735
            }
        ],
            "cols": 256,
            "rows": 256,
        "spatialReference": {
            "latestWkid": 3857,
            "wkid": 102100
        }
    },
}

 

The issue

  • The layer loads without errors

  • No console errors

  • The layer appears in the map layers

  • But no network requests are triggered

  • Nothing appears in the browser Network tab

It seems like the layer is not even attempting to fetch tiles.

0 Kudos
1 Reply
Espada4
New Contributor

.

0 Kudos