Mapbox-gl-js: Call stack size exceeded when calling setPaintProperty in a loop

Created on 22 Aug 2017  路  5Comments  路  Source: mapbox/mapbox-gl-js

Hello,

I am trying to imitate line animation updating line-dasharray property with a setInterval.
Here is the jsfiddle with animation step intentionally set to 1ms to speed up the error to occur:
https://jsfiddle.net/2mws8y3q/2/

The problem is that after several minutes of running, the mapbox crashes with error:

 mapbox-gl.js:307 Uncaught RangeError: Maximum call stack size exceeded
    at Array.toString (native)
    at StyleDeclaration.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:307:1044)
    at StyleTransition._calculateTargetValue (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1422)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:970)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1093)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1093)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1093)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1093)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1093)
    at StyleTransition.calculate (https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js:323:1093)

mapbox-gl-js version:0.39.1

Steps to Trigger Behavior

  1. Open JS Fiddle above
  2. Wait for ~10-15 mins
  3. See console log

Expected Behavior

Animation continues to run

Actual Behavior

Animation stops, mapbox GL crashes.

bug

All 5 comments

Actually, for some reason I am not getting this error anymore. Anyone was able to reproduce the issue?
Could have been some temporary problem with my browser.

It's definitely a bug, and can be reproduced by running the dancing buildings example for a while.

Ok, I can confirm I got this error again a few more times. But it seems intermittent.

As a workaround I added line-dasharray-transition property to set delay and duration to 0:

"line-dasharray-transition": {
"duration": 0,
"delay": 0
}

https://jsfiddle.net/2mws8y3q/3/

This is likely to have been fixed in #5682 or subsequent refactors, so let's close for now and reopen if there's an evidence of a similar error occurring again.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jfirebaugh picture jfirebaugh  路  3Comments

samanpwbb picture samanpwbb  路  3Comments

mollymerp picture mollymerp  路  3Comments

aderaaij picture aderaaij  路  3Comments

yoursweater picture yoursweater  路  3Comments