Issues with rendering

[azrellie]

Rendering with "render multiplier" values 1.5 and over has these unloaded white tiles in the rendered image (and it happens every single time, with the same result, no matter how many times I render the same place).

Multiplier: 1.5

Multiplier: 8 (compressed to upload)

[Casqade]

In my case the problem was due to tile.nextzen.org (that's where tiles are downloaded from) anti-DDoS protection: server returns 429 status code (too many requests).

As a quick-time dirty hack I just added an artificial delay between tile requests in main.js:

logRenderStep("Rendering cells");

// Render each cell:
let count = 0;
for(const bounds of cells) {
  // wait for Leaflet moveend + zoomend events
  await new Promise(r => setTimeout(r, 2000)); // <--- wait 2 seconds
  await async function() {
    return new Promise(resolve => {
      map.once('moveend zoomend', resolve);
      map.fitBounds(bounds);
    });
  }();

You can override main.js source code in your browser DevTools.

Delay time can be decreased as long as it doesn't go above the server threshold for request frequency. This threshold may change in the time being, so my initial delay of 2 seconds won't work forever. Ideally, the code should automatically reload failed tile download requests after some delay to prevent white boxes in the final render. Unfortunately, I'm not a JS developer so solving it properly is up to repository maintainers or other contributors :)

[quentinjeanningros]

I have the same issue, merged to CORS issue,

• starting chrome without CORS didn't fix the issue, so I am sure that CORS is not what make thing go wrong

I use this app often I will be glad to make a PR, but I can't manage to run this app locally : I can't understand why but everything is white, and no tiles are loaded

However, your fix @Casqade help a lot, I tryed to implement a try/catch on this part

map.once('moveend zoomend', resolve);
map.fitBounds(bounds);

but it's not look like the throw errors so it can't loop on error to make it work anyway

[Allakazan]

In my case the problem was due to tile.nextzen.org (that's where tiles are downloaded from) anti-DDoS protection: server returns 429 status code (too many requests).

As a quick-time dirty hack I just added an artificial delay between tile requests in main.js:

logRenderStep("Rendering cells");

// Render each cell:
let count = 0;
for(const bounds of cells) {
  // wait for Leaflet moveend + zoomend events
  await new Promise(r => setTimeout(r, 2000)); // <--- wait 2 seconds
  await async function() {
    return new Promise(resolve => {
      map.once('moveend zoomend', resolve);
      map.fitBounds(bounds);
    });
  }();

You can override main.js source code in your browser DevTools.

Delay time can be decreased as long as it doesn't go above the server threshold for request frequency. This threshold may change in the time being, so my initial delay of 2 seconds won't work forever. Ideally, the code should automatically reload failed tile download requests after some delay to prevent white boxes in the final render. Unfortunately, I'm not a JS developer so solving it properly is up to repository maintainers or other contributors :)

Bro you just saved my day ! I think i'm going to fork this app and implement this new features

[quentinjeanningros]

In my case the problem was due to tile.nextzen.org (that's where tiles are downloaded from) anti-DDoS protection: server returns 429 status code (too many requests). As a quick-time dirty hack I just added an artificial delay between tile requests in main.js:

logRenderStep("Rendering cells");

// Render each cell:
let count = 0;
for(const bounds of cells) {
  // wait for Leaflet moveend + zoomend events
  await new Promise(r => setTimeout(r, 2000)); // <--- wait 2 seconds
  await async function() {
    return new Promise(resolve => {
      map.once('moveend zoomend', resolve);
      map.fitBounds(bounds);
    });
  }();

You can override main.js source code in your browser DevTools. Delay time can be decreased as long as it doesn't go above the server threshold for request frequency. This threshold may change in the time being, so my initial delay of 2 seconds won't work forever. Ideally, the code should automatically reload failed tile download requests after some delay to prevent white boxes in the final render. Unfortunately, I'm not a JS developer so solving it properly is up to repository maintainers or other contributors :)

Bro you just saved my day ! I think i'm going to fork this app and implement this new features

Let me know if it work, i tried but I don't acheive make it work