Skip to content


Subversion checkout URL

You can clone with
Download ZIP
Temporal mapping for CartoDB
JavaScript HTML Other
Latest commit 08e5954 @rochoa rochoa Stubs next version


Build Status

Render big, timeseries data in the client. Uses CartoDB to generate a datacube format. For a brief introduction to the format and methods, see our presentation slides

CartoDB users can use this code right away. Specify your username/tablename and datecolumn to get mapping time immediatley.

Have fun!

Torque library reference

Torque lets you render big, timeseries or categorical data in the client. This is useful for many modern applications that need more than just a static map. Early versions of Torque have been used to visualize human movement, Twitter activity, biodiversity data, and many more large-scale datasets.

The library uses CartoDB to generate a layercube format. For a brief introduction to the format and methods, see our presentation slides. If you are not using CartoDB to host your data, you can modify the input parameters to point toward any layercube service.

Getting started

The simplest way to use a visualization with Torque is...

Create a simple Torque visualization
          <div id="map"></div>
      // define the torque layer style using cartocss
      var CARTOCSS = [
          'Map {',
          '-torque-time-attribute: "date";',
          '-torque-aggregation-function: "count(cartodb_id)";',
          '-torque-frame-count: 760;',
          '-torque-animation-duration: 15;',
          '-torque-resolution: 2',
          '#layer {',
          '  marker-width: 3;',
          '  marker-fill-opacity: 0.8;',
          '  marker-fill: #FEE391; ',
          '  comp-op: "lighten";',
          '  [value > 2] { marker-fill: #FEC44F; }',
          '  [value > 3] { marker-fill: #FE9929; }',
          '  [value > 4] { marker-fill: #EC7014; }',
          '  [value > 5] { marker-fill: #CC4C02; }',
          '  [value > 6] { marker-fill: #993404; }',
          '  [value > 7] { marker-fill: #662506; }',
          '  [frame-offset = 1] { marker-width: 10; marker-fill-opacity: 0.05;}',
          '  [frame-offset = 2] { marker-width: 15; marker-fill-opacity: 0.02;}',

      var map = new L.Map('map', {
        zoomControl: true,
        center: [40, 0],
        zoom: 3

      L.tileLayer('http://{s}{z}/{x}/{y}.png', {
        attribution: 'CartoDB'

      var torqueLayer = new L.TorqueLayer({
        user       : 'viz2',
        table      : 'ow',
        cartocss: CARTOCSS


Grab the complete example source code


see reference

Submitting Contributions

  • You will need to sign a Contributor License Agreement (CLA) before making a submission. Learn more here.
Something went wrong with that request. Please try again.