CartoDB / torque

Temporal mapping for CARTO
http://cartodb.github.com/torque/
BSD 4-Clause "Original" or "Old" License
397 stars 129 forks source link

Update Torque to work with latest version of OL and fix examples #302

Open senakafdo opened 5 years ago

senakafdo commented 5 years ago

First of all, the existing example does not work unless you fix the CDN URLs. See below for some URLs that work.

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/openlayers/3.17.1/ol.css" type="text/css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/openlayers/3.17.1/ol.js"></script>

Next, the way in which the code is written does seem to create issues on newer OL versions. For example, try with the following CDN URLs:

    <link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" type="text/css">
    <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>

You will notice that a portion of the base-map (beneath the torque layer) is not displayed and also the following errors are seen on the console

torque.full.uncompressed.js:3338 Uncaught TypeError: Cannot read property 'call' of undefined
    at e.ol.CanvasLayer._render (torque.full.uncompressed.js:3338)
    at e (events.js:41)
    at e.dispatchEvent (Target.js:101)
    at e.renderFrame_ (PluggableMap.js:1257)
    at e.<anonymous> (PluggableMap.js:191)

The simple fix noted below fixes this issue on line 3338 of torque.full.uncompressed.js, and Torque would thereafter work with OL 5.3.0.

    if (this.requestAnimationFrame && this.requestAnimationFrame.call) {
        this.currentAnimationFrame = this.requestAnimationFrame.call(window, this.render);
    }