tileSize in source option can not overwrite tilejson

[jingsam]

Suppose I want to add a raster source through a tilejson url:

map.addSource('a', {
  type: 'raster',
  url: 'http://a.com/tilejson'
})

However, this tilejson is not configured correctly. The actual tileSize is 512, but in tilejson is configured as 256. So I overwrite the tileSize like this:

map.addSource('a', {
  type: 'raster',
  url: 'http://a.com/tilejson',
  tileSize: 512
})

The expected behavior is that I can load the tile service as 512 tileSize.

However, the code tells me I can't:

mapbox-gl-js/src/source/raster_tile_source.js

Lines 58 to 69 in 88a0526

	this._options = extend({}, options);
	extend(this, pick(options, ['url', 'scheme', 'tileSize']));
	}
	load() {
	this.fire(new Event('dataloading', {dataType: 'source'}));
	this._tileJSONRequest = loadTileJSON(this._options, this.map._transformRequest, (err, tileJSON) => {
	this._tileJSONRequest = null;
	if (err) {
	this.fire(new ErrorEvent(err));
	} else if (tileJSON) {
	extend(this, tileJSON);

As the code shows that tilejson always loads after Source initialization. So if tilejson have tileSize key, it will always overwrite source option.

I think scheme option will face same issue.

[mourner]

Yeah, I think it would be reasonable for explicit properties to take precedence over TileJSON, although it's arguable. Want to explore how a PR could look for the fix?

[jingsam]

@mourner I have send a PR #8232 to enable this feature.

[htrex]

I'm not using tilejson but seeing an issue with the 512 tileSize on a TMS source, please let me understand if I'm missing something or there's a more general bug in mapbox gl and the tileSize 512 setting is always ignored.

I've configured a source just like in following example and mapbox is trying to load the tiles with X and Y coordinates which are exactly double of what is on the file system despite the "tileSize": 512 setting.

    "drone_image_512": {
      "type": "raster",
      "tiles": [
        "https://example.com/maps/drone_image_512/{z}/{x}/{y}.png"
      ],
      "tileSize": 512,
      "minzoom": 14,
      "maxzoom": 23,
      "bounds": [13.716698756, 42.360647913, 13.736451649, 42.369613033],
      "scheme": "tms"
    }

I've received the same raster image also exported with 256 tilesize, in fact the X and Y coordinates double on the file system and it loads perfectly with the following style source:

    "drone_image_256": {
      "type": "raster",
      "tiles": [
        "https://example.com/maps/drone_image_256/{z}/{x}/{y}.png"
      ],
      "tileSize": 256,
      "minzoom": 14,
      "maxzoom": 23,
      "bounds": [13.716698756, 42.360647913, 13.736451649, 42.369613033],
      "scheme": "tms"
    }

The strange thing is that If I change the tileSize setting to 512 on this last example, keeping the same (256) tiles url it still loads fine.
Shouldn't mapbox try to load the tiles with X and Y coordinates which are half when changing the tileSize setting from 256 to 512?
If that's not how TMS is supposed to work, there's a bug in the 3rd party software that exported the tileset (not sure which one but I may ask, eventually).

[jingsam]

@htrex Mapbox use 512 as base tileSize, which is 1 zoom offset compare to ordinary 256 raster tile services. So when you use drone_image_256 with tileSize: 256, it actually request 4 tiles to composite to a 512 raster tile, so you may notice too many tile requests. If set with tileSize: 512, it will stretch one tile to a 512 raster tile, so you will notice blur raster map.

I do not get understand what problems with drone_image_512, maybe a reproduction link would help us to solve your issue. I guess your drone_image_512 is not following mapbox tiling grid scheme. If it is, you can now use options.transformRequest for a temporary fix.

@mourner I have notice many existing map services do not following slippy map tiling scheme, some start with zoom 0, other start with zoom 1. Shall we introduce a zoomOffset in source option just like leaflet does?

[asheemmamoowala]

Closed by #8232