0

I tried combining the code in the example below, with my own code but it does not work: the timeslider continues to count up from 0 and does not display the text alongside the number.

How to Change Torque Map Slider Text

My code is shown below.

What I really want is for my time slider to show the values of one of the columns in the data uploaded to Carto as it plays, preferably with the label "Years B.P.".

But for now all I want to know is why the code from the example does not work with my code?

<!DOCTYPE html>
<html>
  <head>
    <title>javascript_slider_testing_V2</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" />
    <style>
      html, body, #map {
        height: 100%;
        padding: 0;
        margin: 0;
      }

    </style>

    <link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css" />

  </head>

  <body>
    <div id="map"></div>

    <script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script>

    <script>
    function main() {
      cartodb.createVis('map', 'https://hazardgirl09.carto.com/api/v2/viz/47f03cd0-74ea-11e6-ae12-0e3ebc282e83/viz.json', {
        shareable: true,
        title: true,
        description: true,
        search: false,
        tiles_loader: true,
        center: [40.8464, 14.1436],
        zoom: 12
      })
       .done(function(vis, layers) {
          var slider = vis.getOverlay('time_slider')
          slider.formatter(function(d) {
            return "month:" + d.getUTCMonth();
          })
        })
        .error(function(err) {
          console.log(err);
        });
    }
      window.onload = main;
    </script>
  </body>
</html>
1

The code seems to be correct, the problem seems to be caused because the column that you are using for the Torque animation is the cartodb_id instead of a column with dates and that's why it can't extract the month in the d.getUTCMonth() operation, it tries to extract the month from an integer values instead from a date.

  • Thank you! annoyingly the data is geological so, it is older than the (yyyymmdd) format. The date of the oldest eruption was 15,000 years ago. Do you know any way around this? I tried to make this map within Arc, but it wouldn't recognise any time field older than 2000 years. – Danielle Charlton Sep 13 '16 at 14:19
  • CARTO is based on PostgreSQL for the Date and Timestamp format, not sure if PostgreSQL would recognise those old dates as valid or if there is a way to make them valid. Maybe a workaround could be to create a numeric column with only the year of the eruption (as an integer value) and then use that "Year" as the value to display the eruptions with Torque. – oriolbx Sep 14 '16 at 7:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.