WebTileLayer won't work with this URL

[Guy_srb]

Hi 🙂

I want to add to my map a WebTileLayer from this url :

https://cdn.govmap.gov.il/LPD0BBK2022/L01/R00000060/C00000056.jpg

that I got from this site:

https://www.govmap.gov.il/?c=204000,595000&z=0&lang=en

this is my code:

        const  layer = new WebTileLayer({
      urlTemplate:"https://cdn.govmap.gov.il/LPD0BBK2022/L{level}/R{row}/C{col}.jpg"
        });

But I think that the Tile scheme of this cache is different or custom, so I could not load it to my map. 

[Noah-Sager]

Hi @Guy_srb, I tried to get it to work with that same service, but I ran into some 403 errors. Not sure if it's just a CORS error, or if the service is locked down to prevent access. What errors are you getting in the browser console?

[Guy_srb]

I'm getting 403 errors as well, so it's probably locked? I thought it didn't work becuase the col,row and level was diffrenet in this cache.

[UndralBatsukh]

It is not working because the WebTileLayer.urlTemplate does not match the service's tiling scheme. 

You are setting your urlTemplate to send requests like this and this does not exist: https://cdn.govmap.gov.il/LPD0BBK2022/L0/R0/C0.jpg

Looking at the network traffic not sure how this service is structured: https://www.govmap.gov.il/?c=204000,595000&z=0&lang=en

I see that rows and columns have some lettering system... 

Can this map be used in third party apis? Did you check their terms of agreement? Looks like the map has a link the API at the bottom. I tried looking there but I could not find English page.

[JoelBennett]

As @UndralBatsukh was basically saying, WebTileLayer doesn't natively support this tiling scheme.  However, you can override the logic that generates the URL from the level, row, and column values so that the generated URLs do match that particular scheme:

const  layer = new WebTileLayer({
	urlTemplate: "https://cdn.govmap.gov.il/LPD0BBK2022/L{level}/R{row}/C{col}.jpg"
});

layer._addLeadingZeros = function(number, desiredLength) {
	var str = number.toString();

	while (str.length < desiredLength)
		str = "0" + str;

	return str;
};

layer.getTileUrl = function(level, row, col) {
	var lodIndex = level - this.tileInfo.lods[0].level;
	var url;

	if ((lodIndex >= 0) && (lodIndex < this.tileInfo.lods.length)) {
		url = this.urlTemplate.replace(/\$\{level\}/g, this._addLeadingZeros(this.levelValues[level], 2));
		url = url.replace(/\$\{col\}/g, this._addLeadingZeros(col.toString(16), 8));
		url = url.replace(/\$\{row\}/g, this._addLeadingZeros(row.toString(16), 8));
	} else
		url = "data&colon;image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII="; //one transparent pixel

	return url;
};

[Guy_srb]

Thank you very much for the example!

By any chance there is a way to find out the service tile scheme?

[JoelBennett]

Yes, you can determine the tile scheme by poking around a bit in the application's source code using your browser's developer tools.  For example, the tiling info can be seen by doing a search for tileInfo in the esriMap.js file, as shown below:

As for the lods (levels of detail), it appears you can find information for those in the request to GetBackgrounds:

[FIXERROR]

Hi

How to convert tile (x,y) as is the case with Google Maps, which is based on a regular Mercator. To columns and rows for the govmap website that the coordinates are Israel Transverse Mercator (ITM)

How do I set the coordinates to this URL: https://cdn.govmap.gov.il/020522B0B20R/L10/R00012d82/C0001013f.jpg

Based on this: https://cdn.govmap.gov.il/020522B0B20R/L{level}/R{row}/C{col}.png or jpg

I am using C# .net

I tried this but it didn't work:

var url = "https://cdn.govmap.gov.il/M2023ORT3TS/{zoom_gov}/{y_gov}/{x_gov}.jpg";

int til_x = (Convert.ToInt32(x));
int til_y = (int)Math.Pow(2, z) - Convert.ToInt32(y) - 1;
url = url.Replace("{zoom_gov}", "L" + ZOOM_LAYER_ALI.Split(',')[0]);
url = url.Replace("{y_gov}", "R" + til_y.ToString("X8").ToLower());
url = url.Replace("{x_gov}", "C" + til_x.ToString("X8").ToLower());`

[JoelBennett]

The two tiling schemes are not the same, so there is not a one-to-one relationship between the tiles of each.  As seen in the Known Limitations section of the TileLayer documentation, "All tiled layers [in the same map] must have the same tiling scheme and SpatialReference."