failed to invert matrix

[musicformellons]

I get this error. I see other issues relating to using fitbounds, but it looks more like this is triggered by zooming in/out. The chrome browser completely hangs on it and needs restarting.

I am on mapbox-gl-js 0.40.0

Uncaught Error: failed to invert matrix
    at Transform._calcMatrices (mapbox-gl.js?d5ed:123)
    at Transform.prototypeAccessors.zoom.set (mapbox-gl.js?d5ed:123)
    at eval (mapbox-gl.js?d5ed:366)
    at eval (mapbox-gl.js?d5ed:366)
    at a (mapbox-gl.js?d5ed:408)
Transform._calcMatrices @ mapbox-gl.js?d5ed:123
prototypeAccessors.zoom.set @ mapbox-gl.js?d5ed:123
(anonymous) @ mapbox-gl.js?d5ed:366
(anonymous) @ mapbox-gl.js?d5ed:366
a @ mapbox-gl.js?d5ed:408
requestAnimationFrame (async)
timed @ mapbox-gl.js?d5ed:408
e._ease @ mapbox-gl.js?d5ed:366
e.flyTo @ mapbox-gl.js?d5ed:366
(anonymous) @ util.js?93ee:311
setTimeout (async)
postMarker @ util.js?93ee:310
Evented.fire @ mapbox-gl.js?d5ed:424
e._easeToEnd @ mapbox-gl.js?d5ed:366
(anonymous) @ mapbox-gl.js?d5ed:366
e._finishEase @ mapbox-gl.js?d5ed:366
(anonymous) @ mapbox-gl.js?d5ed:366
a @ mapbox-gl.js?d5ed:408
requestAnimationFrame (async)
a @ mapbox-gl.js?d5ed:408
requestAnimationFrame (async)
a @ mapbox-gl.js?d5ed:408
requestAnimationFrame (async)
a @ mapbox-gl.js?d5ed:408
requestAnimationFrame (async)
a @ mapbox-gl.js?d5ed:408
requestAnimationFrame (async)
a @ mapbox-gl.js?d5ed:408

[jfirebaugh]

Thanks for the report @musicformellons. In order for us to diagnose this issue, we'll need to be able to reproduce it ourselves. Could you please create a minimal self-contained JSFiddle that demonstrates the issue?

[musicformellons]

Here a fiddle with this behavior. It will freeze when you run it. The error appears not in the fiddle console, but in the browser console.

When you comment out the offSet in the flyTo, it will run properly.

errormessage in browser console:

transform.js:521 Uncaught Error: failed to invert matrix
    at Transform._calcMatrices (VM292 mapbox-gl.js:141)
    at Transform.prototypeAccessors.zoom.set (VM292 mapbox-gl.js:141)
    at e.<anonymous> (VM292 mapbox-gl.js:366)
    at e.<anonymous> (VM292 mapbox-gl.js:366)
    at a (VM292 mapbox-gl.js:408)
Transform._calcMatrices @ transform.js:521
prototypeAccessors.zoom.set @ transform.js:142
(anonymous) @ camera.js:816
(anonymous) @ camera.js:868
a @ browser.js:52
requestAnimationFrame (async)
timed @ browser.js:57
e._ease @ camera.js:867
e.flyTo @ camera.js:812
(anonymous) @ quwupe.js:25
setTimeout (async)
(anonymous) @ quwupe.js:24
Evented.fire @ evented.js:94
e._easeToEnd @ camera.js:641
(anonymous) @ camera.js:830
e._finishEase @ camera.js:881
(anonymous) @ camera.js:870
a @ browser.js:50
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53
requestAnimationFrame (async)
a @ browser.js:53

[jfirebaugh]

Thanks! This looks like a variant of #4753 that wasn't fixed by #4761. cc @mollymerp

[mollymerp]

Thanks for the report. The browser crash is because your moveend listener is causing an infinite loop because every flyTo call ends with a moveend event (if you change it to map.once('moveend'... it wont crash your whole browser), and I'm working on a fix for the thrown error.