Mapbox: How to avoid JavaScript errors for tilesets that aren't available at the current zoom level?

Question

I'm using Mapbox GL JS and loading tileset layers from my Mapbox account. Some of these tileset layers are only available for zoom levels 10 to 15.

The default zoom level of my map is 5, and when I load the map I get a JavaScript console error, saying that the tileset is 404ing:

Is there any way I can avoid this? I don't want to recreate the tileset all the way to zoom level 5, as it will unnecessarily increase its size.

I don't think the console error is causing any problems in Chrome, but I don't know whether it will in other browsers.

I cannot reproduce this error in the latest release. What version are you using? — Lucas Wojciechowski, Mar 13 '17 at 22:31
I was using 0.32 - just upgraded to 0.33. I still see errors about missing tiles, but is it possible that these are tiles that are missing for some other reason rather than zoom level? — Richard, Mar 14 '17 at 11:16
In case it helps anyone else, I found out that the tiles were 404ing because they'd failed during the tippecanoe tile creation process, because they were over 500k when converted. — Richard, Mar 16 '17 at 12:30

score 8 · Accepted Answer · edited Mar 15 '17 at 04:59

8

The easiest way is to replace the default error handler, filtering out the "Not Found" message:

map.on('error', e => {
    // Hide those annoying non-error errors
    if (e && e.error !== 'Error: Not Found')
        console.error(e);
});

edited Mar 15 '17 at 04:59

unibasil

488
8
18

answered Mar 14 '17 at 04:11

Steve Bennett

114,604
39
168
219

Accepting since this solves the symptom, thank you! To solve the underlying problem, please see my comment on the original question. – Richard Mar 16 '17 at 12:31
Cool - I find this symptom pops up pretty often even with tilesets hosted on Mapbox, as soon as you pan outside the range of the tileset. – Steve Bennett Mar 17 '17 at 05:06

score 2 · Answer 2 · answered Mar 20 '17 at 18:53

2

I have improved our 404 handling for future releases.

In this case, you will still see the browser-provided GET https://... 404 (Not Found) message but not the Javascript Error: Not Found exception message.

answered Mar 20 '17 at 18:53

Lucas Wojciechowski

3,695
16
19

score 2 · Answer 3 · answered Jun 07 '18 at 16:23

2

If you are using your own tile server you can set it up to give a No Content 204 HTTP status.

Here is what it would like in a custom made node.js tile server:

app.use(function(req, res, next) {
  if(res.status(404)) {
    res.sendStatus(204)
  }
});

answered Jun 07 '18 at 16:23

Raphaël Verdier

125
6

According to the [corresponding GitHub ticket](https://github.com/mapbox/mapbox-gl-js/issues/1800) this is the preferred solution by the Mapbox devs. – bluenote10 Mar 12 '20 at 14:32

Mapbox: How to avoid JavaScript errors for tilesets that aren't available at the current zoom level?

3 Answers3

Linked